主要参考链接：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/Shanghai
    username: root
    password: 12345678
    driver-class-name: com.mysql.cj.jdbc.Driver
#redis 配置
redis:
    database: 0
    host: 127.0.0.1 # 本地运行redis
    port: 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;
		#真实IP
		proxy_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：？？？

# 前端 # redis # 后端
Logo
华为云开发者联盟

为开发者提供学习成长、分享交流、生态实践、资源工具等服务，帮助开发者快速成长。

更多推荐

cover

解锁HDC 2024之旅：从购票到报名，全程攻略

avatar 华为云开发者联盟
cover

从原始边列表到邻接矩阵Python实现图数据处理的完整指南

avatar 华为云开发者联盟
cover

华为云云原生FinOps解决方案，释放云原生最大价值

avatar 华为云开发者联盟