[架构之美]若依框架前后端分离版部署全流程详解(本地+服务器+高级配置)

[架构之美]若依框架前后端分离版部署全流程详解(本地+服务器+高级配置)

若依框架前后端分离版部署全流程详解(本地+服务器+高级配置)

若依(RuoYi)作为一款基于SpringBoot和Vue的权限管理系统,凭借其模块化设计和开箱即用的特性广受开发者欢迎。本文将从本地部署、服务器部署、高级配置三个维度,结合常见问题解决方案,详细讲解若依框架前后端分离版的完整部署流程,助力开发者快速上手。

一、本地部署(开发环境)

#下载地址 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. 数据库配置

  1. 修改后端配置文件 ruoyi-admin/src/main/resources/application-druid.yml,更新数据库连接信息:

创建数据库 ry-vue,执行项目中的 sql/ry_20240629.sqlsql/quartz.sql 脚本。数据库创建:

在这里插入图片描述
url: jdbc:mysql://localhost:3306/ry-vue?useSSL=false&serverTimezone=Asia/Shanghaiusername: root password:123456
在这里插入图片描述

3. Redis配置

  • 启动Redis服务(Windows可运行 redis-server.exe)。
  • 修改 application.yml 中的Redis配置:
redis:host: localhost port:6379password:
在这里插入图片描述

4. 前端部署

  1. 进入 ruoyi-ui 目录,安装依赖:
#设置默认镜像源npm config set registry https://registry.npmmirror.com npminstall --registry=https://registry.npmmirror.com # 若依赖冲突,使用以下命令解决(可选)npm i --legacy-peer-deps 

2.启动前端:

npm run dev 
在这里插入图片描述

5.后端启动

  • 在IDEA中运行 RuoYiApplication.java,访问 http://localhost:8080 验证。
在这里插入图片描述

二、服务器部署(生产环境)

1. 服务器环境准备

  • 系统:CentOS 7.x/Ubuntu 24.04
  • 工具:Nginx、JDK 1.8、MySQL、Redis、Node.js

2. 前端打包与Nginx配置

  1. 打包生产环境代码:
npm run build:prod # 生成dist目录
在这里插入图片描述
  1. 配置Nginx反向代理:
nginx 默认安装位置 /usr/local/nginx/conf vim nginx.conf 启动或重启:/usr/local/nginx/sbin ./nginx ./nginx -s reload 
 server { listen 80; server_name your_domain.com; location / { root /home/ruoyi-ui/dist; //根据实际情况填写 index index.html; try_files $uri $uri/ /index.html; } # 后端API代理 location /prod-api/ { proxy_pass http://localhost:8080/; proxy_set_header Host $host; } } 

3. 后端打包与运行

  1. 使用Maven打包JAR:
mvn clean package 
在这里插入图片描述
  1. 上传 ruoyi-admin.jar 至服务器,启动服务:
#启动 实际情况后台启动 java -jar ruoyi-admin.jar 
在这里插入图片描述


通过nginx界面访问:

4. 安全组与防火墙

  • 开放端口:80(前端)、8080(后端)、3306(MySQL)、6379(Redis)。根据实际情况开放设置端口。

三、高级部署方案

1. 前后端合并为单一JAR包

  1. 前端修改
    • 路由模式改为 hashsrc/router/index.js)。
    • 调整 .env.production 中的API路径。
  2. 后端集成
    • 添加Thymeleaf依赖,配置静态资源路径。
    • dist 目录放入 resources,修改 ResourcesConfig 资源映射。
  3. 打包后通过 java -jar 启动,访问路径无需Nginx。

2. Tomcat部署(War包)

  1. 修改 ruoyi-adminpom.xml,将 <packaging>jar</packaging> 改为 war
  2. 排除内置Tomcat依赖,添加Servlet API。
  3. 前端 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集成)。实际部署时需根据项目需求选择合适方式,并注意环境变量、端口权限等细节。若依的灵活架构允许开发者快速扩展,建议结合官方文档与社区资源持续优化。

相关工具下载

如果本教程帮助您解决了问题,请点赞❤️收藏⭐关注支持!欢迎在评论区留言交流技术细节!欲了解密码学知识,请订阅《密码学实战》专栏 → 密码学实战

Read more

C++从入门到实战(十一)详细讲解C/C++语言中内存分布与C与C++内存管理对比

C++从入门到实战(十一)详细讲解C/C++语言中内存分布与C与C++内存管理对比

C++从入门到实战(十一)详细讲解C/C++语言中内存分布与C与C++内存管理对比 * 前言 * 一、C/C++语言中内存分布 * 1.内核空间 * 2.栈 * 3.堆 * 4.数据段 * 5.代码段 * 二、例题带练巩固C/C++语言中内存分布的知识 * 题目讲解 * 题目答案 * 三、C语言动态内存分配(知识回顾) * 3.1 为什么需要动态内存分配 * 3.2 malloc 函数 * 3.3 calloc 函数 * 3.4 realloc 函数 * 3.5 free 函数

By Ne0inhk
C++:list(带头双向链表)增删查改模拟实现

C++:list(带头双向链表)增删查改模拟实现

Hello大家好! 很高兴与大家见面! 给生活添点快乐,开始今天的编程之路。 我的博客:<但愿. 我的专栏:C语言、题目精讲、算法与数据结构、C++ 欢迎点赞,关注 目录    前言:(这里相对于string、vector,相对复杂,讲解较多)            1与string、vector相比:                         1.1没有重载运算符[]接口:                         1.2没有reserve(扩容)接口:                         1.3list增加的接口:                          1.4迭代器的不同:   一、list底层带头双向链表验证,节点构造              1.1节点的构造:              1.2list底层数据结构(带头双向链表)   二   迭代器总结               2.1迭代器的分类(支持的操作/性质)                2.2迭代器的实现:      三

By Ne0inhk
【C++】智能指针:内存管理的利器

【C++】智能指针:内存管理的利器

本文是小编巩固自身而作,如有错误,欢迎指出! 目录 一、何为智能指针 (1)传统指针的缺陷 RAII: 智能指针: 二、智能指针的使用 (1)C++标准库的智能指针 1. std::unique_ptr(独占型智能指针) 2. std::shared_ptr(共享型智能指针) 3. std::weak_ptr(弱引用智能指针) 三、delete删除器 示例 :释放 malloc 分配的内存(替代 free) 示例 :释放数组(默认 unique_ptr  用 delete[],这里自定义)、 一、何为智能指针 (1)传统指针的缺陷

By Ne0inhk
【C++】第二十五节—C++11 (上) | 详解列表初始化+右值引用和移动语义

【C++】第二十五节—C++11 (上) | 详解列表初始化+右值引用和移动语义

嗨,好久不见,我是云边有个稻草人,偶尔中二的C++领域博主与你分享专业知识^(* ̄(oo) ̄)^ 《C++》本篇文章所属专栏—持续更新中—欢迎订阅~ 最近的富文本编辑器给我整不会了,ε=(´-`*)))唉,多了横虚线,点某个位置老是会跳到别的位置或者出现了选中文字或图片的情况 目录 一、C++11的发展历史 二、列表初始化 1. C++98传统的{ } 2. C++11中的{} 3. C++11中的std::initializer_list 三、右值引用和移动语义(重点) 1. 左值和右值 2. 左值引用和右值引用 3. 引用延长生命周期 4. 左值和右值的参数匹配 5. 右值引用和移动语义的使用场景 (1)左值引用主要使用场景回顾 (2)移动构造和移动赋值

By Ne0inhk