线上部署
提示
因为本项目是前后端完全分离的,所以需要前后端都单独部署好,才能进行访问。
1、java 后端部署
1.1、修改application-prod.yml,
(1)、修改文件存放路径
文件路径 示例( Windows配置D:/rcscada/uploadPath,Linux配置 /home/rcscada/uploadPath)
(2)、修改java服务端口 默认
8090
(3)、修改数据库配置
(4)、修改Redis配置
(5)、修改MQTT配置
内部已集成MQTT,如果需要可开启MQTT,
enabled:true
,并配置相关参数
1.2、打jar包
(1)、按照如上图中的步骤,生成jar包;
(2)、将jar包copy到服务器的/home/zutai目录下, 在jar包所在位置执行如下命令:
nohup java -jar rcscada-admin.jar >catalina.out 2>&1 &
2、部署管理后端ui
(1)进入项目目录
cd rceditor-ui
安装依赖
npm install
(2)、打正式环境ui包
npm run build:prod
(2)、将dist文件夹复制到服务器的【/home/zutai/admin-ui】目录;记住存放的位置 (3)、配置服务器nginx
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 12000;
server_name localhost;
charset utf-8;
location / {
root /home/zutai/admin-ui/dist;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
location /prod-api/ {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:8090/;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}其中:12000:为后端ui挂载的端口,可自行修改;
其中:8090:为刚刚部署的java服务的端口;
其中:/home/zutai/admin-ui/dist:为刚刚复制的dist文件夹所在目录;
3、部署编辑器ui
(1)进入项目目录
cd rceditor-demo
安装依赖
npm install
(2)、打正式环境ui包
npm run build:prod
(2)、将dist文件夹复制到服务器的【/home/zutai/editor-ui】,记住存放的位置 (3)、配置服务器nginx
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 81;
server_name localhost;
charset utf-8;
location / {
root /home/zutai/editor-ui/dist;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
location /prod-api/ {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:8090/;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}其中:81:为编辑器ui挂载的端口,可自行修改;
其中:8090:为刚刚部署的java服务的端口;
其中:/home/zutai/editor-ui/dist:为刚刚复制的dist文件夹所在目录;
访问:http://ip:81
4、特别注意
4、1 后端ui访问编辑器的编辑和预览页面配置
后端ui中,在组态列表的操作列中,有访问编辑器的两个按钮
【组态设计】:https://oldzteditor.gzzjy.cn/editor?deviceId=5123549923360
【组态预览】:https://oldzteditor.gzzjy.cn/preview?deviceId=5123549923360
以上两个跳转地址的端口就是上面我们部署编辑器ui挂载的端口,它在这里配置,如下:
4、2、编辑器ui访问后端接口配置
配置如下图所示
需要将 mxRemoteServerRoot的地址 换成 我们java服务的 域名+端口;
需要将 mxRemoteImageRoot的地址 换成 文件的访问服务的 域名+端口;
需要将 mxImageBasePath 换成 我们静态资源的路径,上图中我们的静态资源放在/public/static中 的rcscada文件夹中;rcscada文件夹是固定不变的,不能修改,/public为静态资源的跟路径,所以 我们 mxImageBasePath只需要设置成为/static即可
需要将 mxBasePath 设置成同上即可;