[架构之美]若依框架前后端分离版摆设全流程详解（本地+服务器+高级设置）
若依框架前后端分离版摆设全流程详解（本地+服务器+高级设置）若依（RuoYi）作为一款基于SpringBoot和Vue的权限管理系统，依附其模块化设计和开箱即用的特性广受开辟者接待。本文将从本地摆设、服务器摆设、高级设置三个维度，联合常见问题办理方案，详细讲解若依框架前后端分离版的完备摆设流程，助力开辟者快速上手。
https://i-blog.csdnimg.cn/direct/9f5fcab9bb0341aa84f5d01172ae727d.png#pic_center
一、本地摆设（开辟情况）
#下载地址
https://www.ruoyi.vip/
#环境准备
JDK >= 1.8 (推荐1.8版本)
Mysql >= 5.7.0 (推荐5.7版本)
Redis >= 3.0
Maven >= 3.0
Node >= 12
1. 情况准备
[*]后端依赖：JDK 1.8+、Maven 3.0+、MySQL 5.7+、Redis 5+
[*]前端依赖：Node.js 14+（保举16.x）、npm 6+
[*]开辟工具：IDEA（后端）、WebStorm/VSCode（前端）
2. 数据库设置
[*] 创建数据库 ry-vue，实验项目中的 sql/ry_20240629.sql 和 sql/quartz.sql 脚本。
数据库创建：
https://i-blog.csdnimg.cn/direct/aa502b5172254bc1a7068eee409f1f6f.png#pic_center
[*] 修改后端设置文件 ruoyi-admin/src/main/resources/application-druid.yml，更新数据库连接信息：
url: jdbc:mysql://localhost:3306/ry-vue?useSSL=false&serverTimezone=Asia/Shanghai
username: root
password: 123456
https://i-blog.csdnimg.cn/direct/338b21d5a3d04015b4476891249c06c7.png#pic_center
3. Redis设置
[*]启动Redis服务（Windows可运行 redis-server.exe）。
[*]修改 application.yml 中的Redis设置：
redis:
host: localhost
port: 6379
password:
https://i-blog.csdnimg.cn/direct/fabd909d7fc84a378f861d1fb89b3d53.png#pic_center
4. 前端摆设
[*]进入 ruoyi-ui 目次，安装依赖：
#设置默认镜像源
npm config set registry https://registry.npmmirror.com
npm install --registry=https://registry.npmmirror.com
# 若依赖冲突，使用以下命令解决（可选）
npm i --legacy-peer-deps
2.启动前端：
npm run dev
https://i-blog.csdnimg.cn/direct/99dda108fc68470daded0f182b7c2572.png#pic_center
5.后端启动
[*]在IDEA中运行 RuoYiApplication.java，访问 http://localhost:8080 验证。
https://i-blog.csdnimg.cn/direct/26503c6afe6f4179883fb33186e458a1.png#pic_center
二、服务器摆设（生产情况）
1. 服务器情况准备
[*]系统：CentOS 7.x/Ubuntu 24.04
[*]工具：Nginx、JDK 1.8、MySQL、Redis、Node.js
[*]保举使用宝塔面板：一键安装情况并管理端口。
2. 前端打包与Nginx设置
[*]打包生产情况代码：
npm run build:prod# 生成dist目录
[*]设置Nginx反向代理：
server {
listen 80;
server_nameyour_domain.com;
location / {
root /project/ruoyi-ui/dist;
indexindex.html;
try_files $uri $uri/ /index.html;
}
# 后端API代理
location /prod-api/ {
proxy_pass http://localhost:8080/;
proxy_set_header Host $host;
}
}
3. 后端打包与运行
[*]使用Maven打包JAR：
mvn clean package -DskipTests
[*]上传 ruoyi-admin.jar 至服务器，启动服务：
nohup java -jar ruoyi-admin.jar --spring.profiles.active=prod &
4. 安全组与防火墙
[*]开放端口：80（前端）、8080（后端）、3306（MySQL）、6379（Redis）。根据实际情况开放设置端口。
三、高级摆设方案
1. 前后端合并为单一JAR包
[*]前端修改：
[*]路由模式改为 hash（src/router/index.js）。
[*]调解 .env.production 中的API路径。
[*]后端集成：
[*]添加Thymeleaf依赖，设置静态资源路径。
[*]将 dist 目次放入 resources，修改 ResourcesConfig 资源映射。
[*]打包后通过 java -jar 启动，访问路径无需Nginx。
2. Tomcat摆设（War包）
[*]修改 ruoyi-admin 的 pom.xml，将 <packaging>jar</packaging> 改为 war。
[*]清除内置Tomcat依赖，添加Servlet API。
[*]前端 dist 放入Tomcat的 webapps，设置 server.xml 实现路径映射。
四、常见问题与办理方案
问题场景办理方案引用npm install 失败使用 --legacy-peer-deps 或切换淘宝镜像启动时报OpenSSL错误在 package.json 中添加Node参数数据库连接超时检查MySQL远程访问权限及防火墙规则前端访问空白页Nginx设置 try_files 或检查路由模式接口404错误确保Nginx的 proxy_pass 路径与后端一致 总结
本文覆盖了若依框架从本地调试到生产情况摆设的全流程，并提供了多种摆设方案（JAR/WAR/Nginx集成）。实际摆设时需根据项目需求选择符合方式，并留意情况变量、端口权限等细节。若依的机动架构允许开辟者快速扩展，建议联合官方文档与社区资源持续优化。
相干工具下载：
[*]Node.js | Redis | 宝塔面板
如果本教程帮助您办理了问题，请点赞❤️收藏⭐关注支持！接待在批评区留言交流技能细节！欲了解密码学知识，请订阅《密码学实战》专栏 → 密码学实战
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]