Skip to content

1.环境要求

需要1台4c8g的Linux 服务器,

  1. 确保系统:centOS7/8 或者 ubuntu系统,例:下面以centOS8作为演示

  2. 确保系统安装了 jdk1.8+版本,备注:确保本地编译环境与Linux的jdk环境版本一致。

2.nginx安装

参考 nginx 官网

## 添加 yum 源
yum install epel-release
yum update

## 安装 nginx
yum install nginx

## 启动 nginx 
nginx

## 安装完成后,查看配置
cat /etc/nginx/nginx.conf

3.后端打包&部署

3.1.配置修改

后端 dev 开发环境对应的是 application-dev.yaml (opens new window)配置文件,主要是修改 MySQL 和 Redis 为你的地址。如下图所示: nginx 官网

3.2.编译

找到maven工具,先clean下,再进行packaeg打包 nginx 官网

等待打包完成,找到yudao-server下面文件yudap-server.jar包 nginx 官网

3.3.上传jar

将jar包上传到Linux服务, nginx 官网

3.4.启动jar

命令启动:nohup java -jar yudao-server.jar > output.log 2>&1 &,查看日志output.log日志,日志未出现error报错 nginx 官网

3.5.验证服务

通过命令:telnet localhost 48080 ,确保服务端口已经放开

4.前端打包&部署

4.1 修改配置

前端 dev 开发环境对应的是 .env.dev (opens new window)配置文件,主要是修改 VITE_BASE_URL 为你的后端项目的访问地址。如下图所示 nginx 官网

4.2 编译

在前端项目的根目录下,执行 npm run build:dev 命令,编译前端项目,构建出它的 dist 文件,里面是 HTML、CSS、JavaScript 等静态文件。如下图所示: nginx 官网

4.3 上传

在 Linux 服务器上创建 /work/projects/yudao-ui-admin 目录,使用 scp 命令或者 FTP 工具,将 dist 上传到该目录下。 nginx 官网

4.4 配置nginx转发

  1. 修改nginx配置
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    gzip on;
    gzip_min_length 1k;     # 设置允许压缩的页面最小字节数
    gzip_buffers 4 16k;     # 用来存储 gzip 的压缩结果
    gzip_http_version 1.1;  # 识别 HTTP 协议版本
    gzip_comp_level 2;      # 设置 gzip 的压缩比 1-9。1 压缩比最小但最快,而 9 相反
    gzip_types gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript; # 指定压缩类型
    gzip_proxied any;       # 无论后端服务器的 headers 头返回什么信息,都无条件启用压缩

    server {
        listen       80;
        server_name  192.168.225.2; ## 重要!!!修改成你的外网 IP/域名

        location / { ## 前端项目
            root   /work/projects/yudao-ui-admin;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }

        location /admin-api/ { ## 后端项目 - 管理后台
            proxy_pass http://localhost:48080/admin-api/; ## 重要!!!proxy_pass 需要设置为后端项目所在服务器的 IP
            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;
        }

        location /app-api/ { ## 后端项目 - 用户 App
            proxy_pass http://localhost:48080/app-api/; ## 重要!!!proxy_pass 需要设置为后端项目所在服务器的 IP
            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;
        }

    }

}
  1. 执行 nginx -s reload 命令,重新加载 Nginx 配置

3.请求 http://192.168.225.2/admin-api/ (opens new window)地址,成功访问后端项目,返回结果如下

{"code":401,"data":null,"msg":"账号未登录"}