若依框架---前后端分离项目部署实践

深碍√TFBOYSˉ_ 2023-09-25 18:43 52阅读 0赞

一、环境准备

系统：centos7（可以买ECS或本地安装虚拟机）

安装：git、jdk、maven、npm、mysql、redis、nginx

具体安装方式详见codesheep出品的pdf文档[点击下载][Link 1]提取码：gogo，当然，有些也可以用docker的方式安装，此处不赘述。 文档中没有提到安装包的获取方式，部分整理如下：

>  *  `wget http://download.redis.io/releases/redis-5.0.7.tar.gz`
>  *  `wget https://nodejs.org/dist/v12.18.1/node-v12.18.1-linux-x64.tar.xz`
>  *  `wget --no-check-certificate --no-cookies --header "Cookie: oraclelicense=accept-securebackup-cookie" https://download.oracle.com/otn-pub/java/jdk/8u311-b11/4d5417147a92418ea8b615e228bb6935/jdk-8u311-linux-x64.tar.gz`
>  *  `wget http://nginx.org/download/nginx-1.17.10.tar.gz`
>  *  `wget --no-check-certificate https://dlcdn.apache.org/maven/maven-3/3.8.3/binaries/apache-maven-3.8.3-bin.tar.gz`

注：以下命令是默认在此步骤需要安装的都已正常安装并成功启动的前提下执行，安装路径默认与文档一致，如实际安装路径与文档不一致，请根据自己情况灵活变通。

**二、部署流程**

1.clone若依前后端分离项目

git clone https://gitee.com/y_project/RuoYi-Vue.git

2.安装前后端依赖

#后端
    mvn install
    #前端
    cd ruoyi-ui/
    npm install  --registry=https://registry.npm.taobao.org

3.修改配置

> 修改ruoyi-admin/src/main/resources/application-druid.yml内的mysql的账号密码和ip端口
> 
> 修改ruoyi-admin/src/main/resources/application.yml内的redis的ip端口和密码和安装配置的一致即可

4.打包

#后端
    mvn package
    #前端
    cd ruoyi-ui/
    npm run build:prod

5.启动

#后端
    cd ruoyi-admin/target
    nohup java -jar ruoyi-admin.jar &
    #前端启动方式一（调试时用，正式部署不推荐）
    cd ruoyi-ui/
    npm run dev
    #前端启动方式二（使用步骤4打包生成的dist目录配置nginx，网页访问速度会有质的变化）
    vim /usr/local/nginx/conf/nginx.conf
    ----------------
    #第一行放开，改成如下
    user root;
    #其他位置修改如下
    server {
            listen       80;#80为http默认端口，可以直接访问ip直达项目
            server_name  ?.?.?.?;#?处填写实际的ip地址或域名（ECS的话填公网ip）
            location / {
                root   /?/RuoYi-Vue/ruoyi-ui/dist;#?处填写实际的项目打包路径
                index  index.html;#在root对应目录下找index对应文件
                try_files $uri $uri/ /index.html;#重要，不配置此项，直接访问页面路径会让nginx误认为去dist目录找静态资源，而非去找打包好的页面路径
            }
            location  /prod-api/  {#配置后端路由，prod-api是代码定的
                proxy_set_header Host $proxy_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://?.?.?.?:8080/;#?处填写后台代理地址，8080为后端代码指定的端口
            }
    -----------------
    #检查nginx语法问题，若提示successful，则进行下一步，否则排查一下具体问题
    /usr/local/nginx/sbin/nginx -t
    #重置nginx配置，使其生效
    /usr/local/nginx/sbin/nginx -s reload

6.访问项目

如使用ECS部署，请确保安全组进出端口配置80，8080都已开启并使用公网ip访问

直接在浏览器输入nginx配置的ip或域名，大功告成！

[Link 1]: https://link.juejin.cn?target=https%3A%2F%2Fpan.baidu.com%2Fs%2F1y5K8toxyeN5Y05H-X5hj8Q