本文仅供调侃和有限参考,愿各位共勉之:
“山穷水尽疑无路,柳暗花明又一村”

1. 本文目标

在操作系统系 CentOS 7.6 的Linux云服务上部署“若依”的前后端分离版本的项目(Ruoyi-Vue)
目标很简单,过程很悲惨

之所以没有说明是“阿里云”的云服务器,是因为在其他平台的云服务器的部署步骤类似,只要是CentOS 7.6或以上的操作系统皆可。

2. 服务器

下面贴出的只是在服务器部署项目需要的,不是开发环境,如要了解开发环境要求,可参考若依官方文档:http://doc.ruoyi.vip/ruoyi-vue/

准备项目版本或内容备注说明
操作系统CentOS 7.6 或以上(本文系 7.6,若在其他系统上部署时出现本文所述以外的情况,先自行百度,不行再一起讨论)
Redis>= 3.0存放缓存数据
Mysql>= 5.7.0 (推荐5.7版本)数据库
JDK>= 1.8 (推荐1.8版本)数据库
Nginx(暂无要求)发布和管理项目网站

3. 运维工具

辅助我们在服务器上安装必要的环境和软件

宝塔:https://www.bt.cn/
部署在不同操作系统,对应不同面板的“宝塔”运维工具。我们要在CentOS上使用,就选择:宝塔Linux面板
安装步骤简单,可以参考上方的官网

4. 正式部署

官方说明了两种部署方式:

  1. Nginx + Tomcat(即:后端用war包上传服务器发布)
  2. Nginx + 直接运行Jar包启动后端

本人对比,觉得后者2简单一点。一则不用安装Tomcat,二则Jar包上传和运行Jar包比较灵活一点。 所以我就那方式2说明步骤。

4.1. 设置参数

先提一句,Jar包的形式运行后端,要避免服务器上对应的端口被占用的情况,所以打包前端额端口号的设置就要设好。比如,如果服务器运行着Tomcat,则8080端口被占用,那么下面的一些后台端口设置就要改为别的,比如8083

  • 修改数据库连接,编辑resources目录下的application-druid.yml
# 数据源配置
spring:
    datasource:
        type: com.alibaba.druid.pool.DruidDataSource
        driverClassName: com.mysql.cj.jdbc.Driver
        druid:
            # 主库数据源
            master:
                url: 数据库地址
                username: 数据库账号
                password: 数据库密码
  • 修改服务器配置,编辑resources目录下的application.yml
# 开发环境配置
server:
  # 服务器的HTTP端口,默认为80
  port: 8083
  servlet:
    # 应用的访问路径
    context-path: /应用路径
  • 修改前端接口后端的端口,编辑ruoyi-ui目录下的vue.config.js
devServer: {
    host: '0.0.0.0',
    port: port,
    open: true,
    proxy: {
      // detail: https://cli.vuejs.org/config/#devserver-proxy
      [process.env.VUE_APP_BASE_API]: {
        target: `http://localhost:8083`,  # 要和上一点的端口号设置一样
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      }
    },
    disableHostCheck: true
  },

4.2. 打包

4.2.1. 前端

打开CMD,进入Ruoyi-ui路径下,运行npm run build:prod
例子:

G:\Download\RuoYi-Vue-master\ruoyi-ui>npm run build:prod

等待片刻,会看到提示打包完成的。
如果打包成功,会在项目RuoYi-Vue-master\ruoyi-ui下,出现dist文件夹

4.2.2. 后端

在idea中找到右侧的Maven,点开,先点clean清理项目原有的不需要的打包文件,等待控制台提示清理完成,再点package打包:
在idea中打包Jar包
控制台提示成功后,会在ruoyi-admin文件夹中生成target文件,里面就有Jar包:ruoyi-admin.jar

4.3. 上传程序包

官方给出的路径:/home/ruoyi,当然也可以自己创建
我在/home/ruoyi之下创建了jar文件夹存放Jar包。
又在/home/ruoyi/之下创建了projects/ruoyi-ui文件夹存放dist文件夹下的所有文件
将Jar包上传到/home/ruoyi/jar文件夹下,将dist下所有上传到/home/ruoyi/projects/ruoyi-ui之下

4.4. 启动

4.4.1. 后端

然后在服务器的控制终端里,进入/home/ruoyi/jar目录,运行代码启动后端程序:

java –jar ruoyi-admin.jar

然后再控制台正常可以看到如开发调试时启动后台成功一样的文字。
这行代码运行后,如果关掉控制台则会停止。
需要一直保持后端运行,则用如下代码:

nohup java -jar ruoyi-admin.jar

停止后台运行:

ps -ef |grep ruoyi-admin.jar|grep -v 'grep' |awk '{print $2}'|xargs kill -9^C

4.4.2. 前端

打开“宝塔”找到软件里的Ngnix点开,在设置文件里清掉原有的内容,黏贴如下官方的若依要求的设置:

worker_processes  1;

events {
    worker_connections  1024;
}

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

    server {
        listen       80; // 默认80端口监听访问请求,我们也不变,当然你可以根据你的需求修改
        server_name  localhost;
		charset utf-8;

		location / {
            root   /home/ruoyi/projects/ruoyi-ui;  // 因为前端路径,这里我严格使用官方给额路径,就不用改;若你自己创建了目录,就改为你的路径;
			try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
		
		location /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:8083/; // 因为我们使用8083来跑后端服务,这里也相应改为8083
		}

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

最后重启Ngnix
则可以通过服务器ip地址直接访问刚部署好的Ruoyi-Vue项目了。

4.5. 可能出现的问题和解决方向

问题代码可能的问题和解决方向
502后端项目未启动或启动失败
404后端项目未启动或启动失败、Ngnix未启动、服务器问题
500数据库连接失败,数据库连接不正确、数据库软件未安装、数据库未启动等、数据库部署等
一直进度条加载菜单中设置的view路径设错、前端代码放错目录导致更新后无法更新Ngnix指向的代码
Logo

快速构建 Web 应用程序

更多推荐