前后端分离项目部署（4）---项目运行

前面把所有的环境都准备好了，现在就可以进行项目正式部署了

1.项目打包

前端项目使用

pnpm run build

后端我是基于maven构建的

mvn clean install -U

2.打包后的文件上传

在文件这里新建一个文件夹来存放本次的项目

3.运行jar包

jar包直接使用这个命令就可以后台自动运行，注意更改名字和端口

这里还要注意修改数据库的地址和查看权限

nohup java -jar server-1.0.jar --server.port=7090 > /dev/null 2>&1 &

nohup可以让jar包在后台自动运行

运行完成之后会生成一个输出日志文件夹

你可以在里面看java的运行情况

如果没有生成，那就是配置文件没有配置好位置

运行完之后可以看一下端口服务是否启动，如果发现冲突端口，就换一个或者kill

ps -ef | grep java

4.运行前端编译文件（该方法时使用的宝塔安装nginx，如果手动安装的话，文件的路径要修改一下）

cd /www/server/panel/vhost/nginx/

进入nginx的配置文件新建一个.conf文件

server {
                listen 开放端口;
                server_name 公网IP;
                charset utf-8;
                  location / { 
                      alias /www/easy/dist/;
                       try_files $uri $uri/ /index.html;
                       index  index.html index.htm;
                        }

                location /api { 
                     proxy_pass http://localhost:7070/api;
                     proxy_set_header x-forwarded-for  $remote_addr;
                     }
}

alias /www/easy/dist/;

配置的是前端的index的请求路径

 location /api { 
 proxy_pass http://localhost:7070/api;
proxy_set_header x-forwarded-for  $remote_addr;
}

配置的是前端请求代理，配置这里就不用修改前端代码里的请求路径了，否则就要修改前端请求地址为后端开放的端口

1. proxy_set_header: 这是nginx的一个指令，用于设置向后端服务器发送的HTTP头部字段。

2. x-forwarded-for: 这是一个自定义的HTTP头部字段，在HTTP代理或负载均衡器上经常使用。它用于传递原始客户端的IP地址给后端服务器。

3. $remote_addr: 这是nginx内置变量，表示客户端的IP地址。当nginx作为反向代理服务器时，$remote_addr代表了反向代理服务器与客户端之间的连接的IP地址。

进入nginx的安装位置,这是使用宝塔安装nginx的默认目录

cd /www/server/nginx/sbin

检查重启服务

nginx -t

nginx -s  reload

监听端口之后注意在阿里云开放对应的端口

对文件的压缩可以优化nginx的效率

[root@proxy ~]# cat /usr/local/nginx/conf/nginx.conf

http {

.. ..

gzip on;       //开启压缩

gzip_min_length 1000;    //小文件不压缩

gzip_comp_level 4;    //压缩比率

gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript; //对特定文件压缩

编辑完成之后，重新加载nginx

cd /www/server/nginx/sbin/

./nginx -s reload

如果首页出现了白屏的现象，我的认为是前端的资源太大，可以在打包的时候进行配置页面的懒加载

然后输入你开放的前端端口就可以访问了