手动部署RuoYi前后端分离项目

RuoYi文档地址:http://doc.ruoyi.vip
前后端不分离项目地址:https://gitee.com/y_project/RuoYi(前端代码位于 src/main/resources/templates
前后端分离项目地址:https://gitee.com/y_project/RuoYi-Vue (此前端代码位于 /ruoyi-ui 为vue2版本,vue3版本前端地址:https://github.com/yangzongzhuan/RuoYi-Vue3)

1. 后端项目

1.1 环境准备

JDK、MySQL、Redis、Maven

1.2 运行

  1. 创建数据库ry-vue并导入数据脚本ry_2021xxxx.sql,quartz.sql
  2. 打开项目运行com.ruoyi.RuoYiApplication.java,出现 (♥◠‿◠)ノ゙ 若依启动成功 ლ(´ڡლ)゙ ` 表示启动成功。
  3. 验证 http://localhost:8080

配置文件位于:src/main/resources/application.yml (application-druid.yml)

其中如下地址需要注意:

# src/main/resources/application.yml
# 文件路径 示例( Windows配置D:/ruoyi/uploadPath,Linux配置 /home/ruoyi/uploadPath)
  profile: /home/ruoyi/uploadPath

# src/main/resources/logback.xml


1.3 打包

  1. 执行 /bin/package.bat 脚本 或 mvn clean package -Dmaven.test.skip=true 命令
  2. 生成包位置 /ruoyi-admin/target/ruoyi-admin.jar

主模块 ruoyi-admin,依赖其他模块,如ruoyi-frameworkruoyi-common等,打包时其他模块同理打出jar包供主模块依赖

可修改打包方式为 war/jar,位置 /ruoyi-admin/pom.xml文件中的 jar

1.4 部署运行

  1. 上传至服务器目标位置
  2. 执行命令运行 java -jar ruoyi-admin.jar
  3. 验证,服务器终端 curl 127.0.0.1:8080 或 浏览器打开服务器对应地址+端口验证,注意端口占用,默认是8080端口

2. 前端项目

2.1 环境准备

Node、Nginx(部署使用)

2.2 运行

yarn install
yarn dev

根据执行日志提示对应的网址打开验证,默认地址是http://localhost:80,默认账户/密码 admin/admin123

2.3 打包

  1. yarn build:prod
  2. 生成位置 /dist 文件夹,里面就是构建打包好的文件,通常是 .js 、.css、index.html 等静态文件。

打包配置位于 /vite.config.js/vue.config.js,依赖打包工具不同
其中如下配置需要注意:

// 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.ruoyi.vip/admin/,则设置 baseUrl 为 /admin/。
    base: VITE_APP_ENV === 'production' ? '/' : '/',

2.4 部署

放置服务器上,请求地址的端口和后端项目端口不一致,导致接口请求失败

使用Nginx 服务器转发

  1. 配置/usr/local/etc/nginx/nginx.conf
http {
    
    server {
        listen     80; # 1 设置 Nginx 监听的端口
        #root /your_custom_directory; # 2 此处定义Nginx的根路径,或下方也可

        location / {
            root   /your_custom_directory; # 2 同上
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
        
        location /prod-api/ { # 3 对 域名+/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:8080/; # 4 转发到目标地址
        }
    }

    # 其他监听配置
    server {
        listen 8080;
        ...
    }
}
  1. 将打包生成的 dist 文件夹放到配置的 /your_custom_directory 的目录下(可额外新建子目录)
  2. 验证,注意请求Nginx的端口,在请求接口 /prod-api 就会转到目标地址,否则会请求不到

java 项目 8080
前端项目用 Nginx 的目录下 然后转发到8080端口
本地可以修改 Nginx 的 location 的根目录
前端访问地址统一用 Nginx 的端口,这样 vue项目请求接口就能请求到java项目了

自动部署

使用Jenkins实现打包、发布、部署
同时使用docker镜像+Registry(harbor)
k8s 编排容器
https://blog.csdn.net/weixin_54202028/article/details/125989942

Springboot整合MongoDB的Docker开发,其它应用也类似

微软Docker微服务开发流程

『中级篇』 Docker Bridge详解(26)
『中级篇』 docker容器之间的Link(27)

你可能感兴趣的:(手动部署RuoYi前后端分离项目)