web应用上线发布详细流程（jeecg-boot，vue3）

主要参考链接：JAR部署方案 · JeecgBoot 开发文档 · 看云

web应用在服务器上线总体流程：部署网站到服务器（完整版） - 知乎

步骤	公网	工具、方法
1、前提准备	购买服务器
	购买域名
	开发前后端项目
2、部署环境	远程连接服务器	向日葵远程
	配置运行环境	数据库、java、nginx、redis、（tomcat）
3、部署项目	后端项目部署	redis war包：tomacat jar包：java -jar
	前端项目部署	nginx
4、开启防火墙	服务器地址映射？
	开放端口	windows防火墙高级设置
5、访问应用	公网域名/localhost:端口号

后端服务通过jar方式运行，前端项目build的dist，部署到nginx。

在部署发布前需要配置好相应运行环境：java、数据库（mysql）、nginx、redis（、tomcat），以及配置好服务器的网络，前后端都已经实现。

一、jeecg-boot项目构建后端jar包

二、通过JAR方式启动后端（命令行启动）

三、前端项目构建（vue3）

四、前端项目发布

五、设置防火墙，开放端口号

六、应用无法正常启动的情况

七、将redis、nginx添加为服务

一、jeecg-boot项目构建后端jar包

1、初始化数据库

执行Sql脚本： jeecg-boot/db/jeecgboot-mysql-5.7.sql

还需执行如下两个sql脚本：Vue3升级脚本_mysql.sql，V2_V3.sql，参考：

切换Vue3路由 · JeecgBoot Vue3前端文档 · 看云

2、修改配置文件 application-prod.yml。文件路径如下：

jeecg-boot-master/jeecg-module-system/jeecg-system-biz/src/main/resources

修改数据库链接、缓存redis、上传附件等配置

# 数据库配置，密码自设，与本机数据库密码相同
datasource:master:url: jdbc:mysql://127.0.0.1:3306/jeecg-boot?characterEncoding=UTF-8&useUnicode=true&useSSL=false&tinyInt1isBit=false&allowPublicKeyRetrieval=true&serverTimezone=Asia/Shanghaiusername: rootpassword: 12345678driver-class-name: com.mysql.cj.jdbc.Driver

#redis 配置
redis:database: 0host: 127.0.0.1 # 本地运行redisport: 6379#redis密码自设，在redis.conf文件中配置password: 12345678

其余保持文件默认状态。

3、切换Maven为生产模式

单击idea右侧maven处->Profiles->选择prod

解释：pro表示production，dev表示development

4、打包生成jar包

maven下，jeecg boot3.4.0（root）文件夹->生命周期->install。

等程序执行完之后，会在以下目录生成jar包：

jeecg-module-system/jeecg-system-biz/target/jeecg-system-biz-3.4.0.jar

上述2、3、4为生产模式（prod）下的操作，单独运行后端时为开发模式（dev）。当为开发模式时，2处修改文件为application-dev.yml，3处选择为dev。4处不打包，而是在idea中运行java文件，路径如下。没有报错可以正常访问输出中的网址即可。

jeecg-module-system/jeecg-system-start/src/main/java/org/jeecg/JeecgSystemApplication.java

二、通过JAR方式启动后端（命令行启动）

1、开启redis服务

开启前，对redis.conf进行如下配置：

注释掉network下的：bind 127.0.0.1 ::1 （#表示注释）

设置security下的requirepass：requirepass 12345678 （即redis密码）

# redis 默认不设密码，最好设置，application-prod.yml文件中redis配置与此保持一致

以下设置在redis老版本中可能没有，没有忽略即可。

设置general下的daemonize：daemonize yes （表示开启后台运行）

设置network下的protected-mode：protected-mode yes

当没有设置requirepass时，将protected-mode修改为no。

redis.conf文件路径

windows：redis安装包内，通过notepad++软件修改相关配置

mac：/opt/homebrew/etc/redis.conf，通过vim命令修改相关配置

redis未开启，或redis配置文件未修改，运行后端jar包，可能会报下面的错误：

error: o.s.d.redis.listener.RedisMessageListnerContainer:665

2、cd进入jar包所在文件夹，也可将jar包路径写为完整绝对路径，而无需先进入文件夹下。

3、执行如下命令运行jar包

windows： java -jar jar包路径

mac：sudo java -jar xxx.jar，不加sudo可能会报错。

开发模式只需要在idea中执行java文件即可，不需要这部分上述步骤。

三、前端项目构建（vue3）

1、在文件.env.production中配置后台接口地址

# 本机localhost配置
VITE_GLOB_API_URL=http://localhost:8080/jeecg-boot
VITE_GLOB_DOMAIN_URL=http://localhost:8080/jeecg-boot

公网发布时，将localhost:8080修改为自己的域名地址。开发模式则不需要修改。

在 .env.production 内，设置 VITE_LEGACY=true 即可打包出兼容旧版浏览器的代码

    VITE_LEGACY = true

2、构建前端项目

在idea窗口下方的终端中执行以下命令：

# 执行命令下载依赖，第一次构建时需要
yarn install
# 构建前端项目包
npm run build

运行完成后，在jeecgboot-vue3-master根目录生成 dist 文件夹，即为打包好的文件。

上述流程为生产模式（production）下的做法。在开发者模式下，1中修改的文件为.env.development。2中将命令npm run build换为npm run serve即将前端项目运行起来。

四、前端项目发布

1、将生成的dist文件复制到nginx安装目录下的html文件中，路径如下：

windows：nginx安装目录下的html文件中

mac：/opt/homebrew/Cellar/nginx/1.23.1/html

dist文件夹名称可以自己修改，修改后需要在nginx配置文件中root处进行相应修改。

nginx.conf文件路径：/opt/homebrew/etc/nginx/nginx.conf

2、nginx正式部署，修改nginx配置文件

# 下列配置为官方给的，修改后的在下面代码块
upstream boot3.jeecg.com {server 127.0.0.1:80;}
server {listen       80;server_name  boot3.jeecg.com;root        /srv/www/project;location / {# 用于配合 browserHistory使用try_files $uri $uri/ /index.html;}location  /jeecgboot/ {proxy_pass         http://127.0.0.1:8080/;proxy_redirect off;#真实IPproxy_set_header  Host             $host;proxy_set_header  X-Real-IP        $remote_addr;set $my_proxy_add_x_forwarded_for $proxy_add_x_forwarded_for;if ($proxy_add_x_forwarded_for ~* "127.0.0.1"){set $my_proxy_add_x_forwarded_for $remote_addr;}proxy_set_header   X-Forwarded-For $my_proxy_add_x_forwarded_for;}error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}}

# 请把上面配置中的的boot3.jeecg.com换成自己的域名：localhost
# root修改为dist目录：html/dist

# 修改后的代码块示例，可以直接使用upstream localhost {server 127.0.0.1:80;}server {listen       80;server_name  localhost;root html/dist;#charset koi8-r;location / {# 用于配合 browserHistory使用try_files $uri $uri/ /index.html;}#access_log  logs/host.access.log  main;location  /jeecg-boot {proxy_pass         http://localhost:8080/jeecg-boot;}error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}}

编辑完之后，需要在cmd中执行一下命令，nginx配置才能生效：

nginx -s reload

需要先运行nginx之后，才可以执行上述命令，否则会报错，命令行运行nginx方法如下：

windows：单击安装包下的nginx.exe

mac：直接输入nginx即可

在开发者模式下，不需要该部分上述步骤。

至此，前后端基本部署完成。在开发模式下，通过访问前端项目输出的网址验证。默认用户名/密码为jeecg/123456。

五、设置防火墙，开放端口号

windows系统：控制面板->系统和安全->windows防火墙->高级设置->入站规则->新建规则->端口->TCP，特定本地端口->输入端口号->允许连接->域、专用、公用->输入名称->完成

进入高级设置还可以通过：“win+r”组合键打开运行框，输入命令：firewall.cpl，确定

开放的端口号为80和8080，与nginx配置中保持一致。分别创建两个新的入站规则即可。

在公网访问前，还需要将购买域名与本地地址（localhost:8080）建立映射。

至此，可以直接通过公网网址访问。

六、应用无法正常启动的情况

1、网页显示浏览器找不到服务器，原因可能是后台没有正常启动。查看是否启动redis。

2、出现登录页面，但验证码无法正常显示，原因可能有两个：

nginx网址配置有误

服务器防火墙未开放端口

七、将redis、nginx添加为服务

目前redis、nginx需要人工进行启动，添加到系统服务则会开机自启动。方法如下：

windows下：

redis：redis-server.exe --service-install redis.windows.conf

nginx：？？？