基于 RuoYi-Vue-Pro 定制了一个后台管理系统 , 开源出来!

1 项目背景
从职业生涯伊始,我一直是微服务架构的坚定拥趸,这很大程度上源于长期深耕互联网行业,习惯了高并发、分布式架构下的开发模式。
然而,去年在优化某航空公司核心用户中心系统时,我的技术认知受到了不小的冲击。
因为航空公司用户中心是一个典型的单体应用——尽管业务量不小,但稳定的业务模型和有限的扩展需求,使得单体架构反而比微服务更高效、更经济。
事实上,单体应用在 IT 领域始终占据着不可替代的生态位。甚至可以说,在大多数业务场景下,单体架构不仅完全够用,甚至可能是更优解。
它的价值主要体现在:开发效率高、运维复杂度低,尤其适合业务边界清晰、迭代节奏可控的中小型系统。
因此,我想自己写一个单体开发框架,但考虑到从零开始,会花费较长的时间,最终决定在成熟的单体开发框架上定制开发。
在知乎、Github 上搜索【快速开发框架】 ,很多的话题都绕不开若依 RuoYi 。开源世界 RuoYi 单体框架有三个不同的项目,分别是:ruoyi-vue 、ruoyi-vue-plus 、ruoyi-vue-pro 。
这三个项目源码,我都仔细研读过了,功能对比细节如下表 :
| 评估维度 | RuoYi-Vue | RuoYi-Vue-Plus | RuoYi-Vue-Pro |
|---|---|---|---|
| 核心优势 | 极简开箱即用 | 多租户/功能增强 | 全生态功能预制 |
| 二次开发 | (源码简洁) | ☆(需理解模块化) | (需深度裁剪) |
| 成本效益 | 人力/时间成本最低 | 中等投入高回报 | (中等偏上)需评估功能利用率 |
有兴趣的同学可以参看对比文章 ,https://mp.weixin.qq.com/s/J_FUQHB3Ji35Uk1e40yHWg
最终,我选择基于 RuoYi-Vue-Pro 进行定制开发 ,原因很简单:基础功能丰富,且 UI 界面也符合我的口味。
项目的名称:magic-admin , 保留了 RuoYi-Vue-Pro 的基础功能 ,同时在客户端管理、代码组织结构、 多租户管理这三个层面做了定制。
2 设计概览
后端单体开发平台基于开源项目 ruoyi-vue-pro 重构 。

- 后端采用 Spring Boot、MySQL + MyBatis Plus、Redis + Redisson
- 消息队列可使用 Event、Redis、RabbitMQ、Kafka、RocketMQ 等
- 权限认证使用 Spring Security & Token & Redis,支持多终端、多种用户的认证系统
- 支持加载动态权限菜单,按钮级别权限控制,Redis 缓存提升性能
模块设计图如下:

1、基础模块
| 功能 | 描述 |
|---|---|
| 用户管理 | 用户是系统操作者,该功能主要完成系统用户配置 |
| 角色管理 | 角色菜单权限分配、设置角色按机构进行数据范围权限划分 |
| 菜单管理 | 配置系统菜单、操作权限、按钮权限标识等,本地缓存提供性能 |
| 部门管理 | 配置系统组织机构(公司、部门、小组),树结构展现支持数据权限 |
| 岗位管理 | 配置系统用户所属担任职务 |
| 客户端管理 | 配置系统客户端信息 |
| 字典管理 | 对系统中经常使用的一些较为固定的数据进行维护 |
| 操作日志 | 系统正常操作日志记录和查询 |
| 登录日志 | 系统登录日志记录查询,包含登录异常 |
| 通知公告 | 系统通知公告信息发布维护 |
| 地区管理 | 展示省份、城市、区镇等城市信息,支持 IP 对应城市 |
2、基础设施
| 描述 | |
|---|---|
| 代码生成 | 前后端代码的生成(Java、Vue、SQL、单元测试),支持 CRUD 下载 |
| 系统接口 | 基于 Swagger 自动生成相关的 RESTful API 接口文档 |
| 表单构建 | 拖动表单元素生成相应的 HTML 代码,支持导出 JSON、Vue 文件 |
| 配置管理 | 对系统动态配置常用参数,支持 SpringBoot 加载 |
| 定时任务 | 在线(添加、修改、删除)任务调度包含执行结果日志 |
| 文件服务 | 支持将文件存储到 S3(MinIO、阿里云、腾讯云、七牛云)、本地、FTP、数据库等 |
| 消息队列 | 基于 Redis 实现消息队列,Stream 提供集群消费,Pub/Sub 提供广播消费 |
| 服务保障 | 基于 Redis 实现分布式锁、幂等、限流功能,满足高并发场景 |
界面截图见下图:

3 定制功能
1、删除多租户功能
多租户功能是指一套系统可以同时服务多个不同的租户(客户或组织),并且每个租户的数据和配置相互隔离,彼此不可见。
| 方式 | 说明 | 优缺点 |
|---|---|---|
| 独立数据库 | 每个租户使用单独的数据库 | 隔离性好,安全性高 运维成本高 |
| 共享数据库,独立Schema | 同一数据库,不同租户使用不同表结构(Schema) | 资源利用率高 需数据库支持 |
| 共享数据库,共享表(租户ID字段) | 所有租户数据存同一表,用 tenant_id 区分 |
成本最低 需严格代码控制 |
ruoyi-vue-pro 是采用了第三种方式来实现的,每张表需要添加 tenant_id 字段 ,我认为不同的业务形态对于多租户功能的需求是不一样,采用一刀切的使用 tenant_id 区分可能会导致系统的复杂度更高 , 出现 BUG 的风险系数高,所以我删除了多租户功能,保持和 ruoyi-vue (若依版本) 一致。
2、客户端管理
后台系统不仅仅可以支持后台登录,也应该可以支持 APP 或者 小程序等其他终端登录。

不同终端在发送请求时,都需要再请求头中传输客户端 Key , 不同终端可配置独立的 Token 有效期、权限策略。
3、Token 管理
下图是 ruoyi-vue-pro 的 Token 记录表 即:数据库是 Token 的存储容器 。

虽然每次查询 accessToken 都会先从 Redis 先查询一次 ,但假如在同一时刻有大量 Token 失效,那么数据库就会成为瓶颈,可能会有缓存雪崩的风险。

而且 Token 的生命周期通过数据库管理,需要考虑很多的细节,我不确定从功能角度形成闭环。
我的做法是所有的 Token 都通过 Redis 来存储,同时每个客户端都有独立的 namespace ,见下图:

4、包层级结构
相比 ruoyi-vue-pro , 我更加倾向于相对简洁的包层级结构。

如图,包结构分为 controller 、domain、mapper 、 service 四个核心包,同时 domain 根据领域分为五个子包:
- dataobject : 数据实体对象 ,可以简单的理解,一个对象映射一张表
- enums:枚举对象,比如错误码
- vo: 前端请求/响应对象
- convert :通过 service 将 dataobject 对象转换成 VO 对象
- dto:内置服务调用对象
同时,我也修改了代码生成逻辑,生成的目录也完全按照上面的标准。

4 启动服务端
本地电脑上项目运行环境依赖组件以及版本信息如下:
- IntelliJ IDEA 版本 2019 +
- Git 代码版本管理工具
- JDK 8 +
- Maven(如果 IntelliJ IDEA 2021 版本及以上,内置了 Maven 组件)
01 克隆项目
打开 Github 项目地址, 复制对应的 SSH 或 HTTP 克隆地址。

打开 IntelliJ IDEA,菜单栏顶部找到 Git -> Clone 选项。

点击 Clone 后,URL 文本框填写项目的 HTTP 或 SSH 地址,比如 HTTP 的地址:git@github.com:makemyownlife/magic-admin.git,Directory 填写项目存储在本地的目录地址。

等待克隆及 Maven 初始化即可。

拉下来后,可在项目根目录执行 mvn clean install 测试是否具备运行环境。
02 初始化 MySQL
项目当前支持 MySQL 5.7 + ,首先需要创建一个名字为 magic-admin 数据库 。

然后分别导入 magic_admin.sql ,quartz.sql 这两个文件。
magic_admin.sql:用于创建或初始化 MagicAdmin 后台管理系统所需的数据库结构和初始数据 。
quartz.sql : Quartz 调度框架的数据库脚本,用于在数据库中创建 Quartz 所需的表结构,以便支持持久化任务调度 。
03 项目启动
项目依赖 JDK 1.8 + ,因此理论上兼容性非常强。
配置文件分为 生产 prod 、本地开发 local 两个环境文件,在本地运行,需要修改本地环境文件。

1、修改 MySQL 数据库信息:

2、修改 Redis 数据库信息:

个人本地环境,一般笔者并不会开启密码,建议生产环境开启。
启动 MagicAdminApplication.java 即可。

5 启动 admin UI
前端 UI 需要在本机安装 NodeJs ,可参考:
https://www.runoob.com/nodejs/nodejs-install-setup.html
https://blog.csdn.net/weixin_45565886/article/details/141828707
打开 Githu 项目地址:https://github.com/makemyownlife/magic-admin-ui 复制对应的 SSH 或 HTTP 克隆地址。

通过 git clone 命令克隆到本地自定义目录,然后执行如下命令:
# 安装 pnpm,提升依赖的安装速度
npm config set registry https://registry.npmjs.org
npm install -g pnpm
# 安装依赖
pnpm install
# 启动服务
npm run dev
启动完成后,浏览器会自动打开 http://localhost:80 ,可以看到前端界面。

默认账号密码:admin/magic123456
6 未来规划
框架设计的原则还是要简洁和易于维护,未来会在如下两个层面持续优化:
1、客户端管理优化(加密签名增强)
2、添加流程引擎模块(企业级工作流支持)
基于 RuoYi-Vue-Pro 定制了一个后台管理系统 , 开源出来!的更多相关文章
- 如何使用Vue.js来搭建一个后台管理系统
目录 使用的技术 基础但不好版 1.初始化项目 2.实现初始页内容自定义 3.使用路由 原始代码 自建页面 修改路由 4.测试路由跳转 补充 子路由版 嵌套router-view 定义子路由 修改菜单 ...
- 使用React全家桶搭建一个后台管理系统
引子 学生时代为了掌握某个知识点会不断地做习题,做总结,步入岗位之后何尝不是一样呢?做业务就如同做习题,如果‘课后’适当地进行总结,必然更快地提升自己的水平. 由于公司采用的react+node的技术 ...
- Vue实战狗尾草博客后台管理系统第三章
Vue实现狗尾草博客后台管理系统第三章 本章节,咱们开发管理系统侧边栏及面包屑功能. 先上一张效果图 样式呢,作者前端初审,关于设计上毫无美感可言,大家可根据自己情况设计更好看的哦~ 侧边栏 这里我们 ...
- TP-admin即基于ThinkPHP5拿来即用高性能后台管理系统
TP-Admin即基于ThinkPHP5的web后台管理系统(总结一套自己的后台管理系统,方便自己后续的项目开发.) 主要特性:自适应手机端.支持国际化.吸取其他CMF框架优点.多站点部署.日志记录. ...
- Vue3教程:Vue 3 + Element Plus + Vite 2 的后台管理系统开源啦
之前发布过一篇文章<Vue3教程:开发一个 Vue 3 + element-plus 的后台管理系统>,文中提到会开发并开源一个 Vue 3 + Element Plus 的项目供大家练手 ...
- [转载]Vue 2.x 实战之后台管理系统开发(一)
2. 开发前须知 我的后台管理系统项目运用了如下框架/插件: Vue 2.x —— 项目所使用的 js 框架,我所使用的版本是:2.1.10 vue-router 2 —— Vue 2.x 配套路由, ...
- 【转载】Vue 2.x 实战之后台管理系统开发(二)
2. 常见需求 01. 父子组件通信 a. 父 -> 子(父组件传递数据给子组件) 使用 props,具体查看文档 - 使用 Prop 传递数据(cn.vuejs.org/v2/guide/co ...
- Vue实战狗尾草博客后台管理系统第七章
Vue实战狗尾草博客后台管理平台第七章 本章内容为借助模块化来阐述Vuex的进阶使用. 在复杂项目的架构中,对于数据的处理是一个非常头疼的问题.处理不当,不仅对维护增加相当的工作负担,也给开发增加巨大 ...
- xadmin快速搭建一个后台管理系统
环境:python3.5.2 ,django 2.0 ,xadmin2.0 Firsttly, 到 https://github.com/sshwsfc/xadmin/tree/django2上下载源 ...
- vue elementui 写的一个后台管理页面模板
https://github.com/PanJiaChen/vue-element-admin
随机推荐
- TVM相关
TVM介绍 为解决深度学习框架和硬件后端适配问题,华盛顿大学的陈天奇等人提出了TVM. TVM是一个端到端的全栈编译器,包括统一的IR堆栈和自动代码生成方法,其主要功能是优化在CPU.GPU和其他定制 ...
- JDK安装及IDE安装编辑
1.下载及安装JDK 下载地址:http://www.oracle.com/technetwork/java/javase/downloads/index.html 环境变量的系统变量填上如下: 变量 ...
- STM32在使用Clion平台开发时调试失败 SystemClock_Config 返回 HAL_ERROR
问题记录 在尝试使用Clion在STM32平台上开发调试时,需要通过OpenOCD结合ST-Link等调试器进行烧录和调试.但通过STM32CubeMX生成代码后,发现出现以下现象: 程序能够正常编译 ...
- Android Studio 中 TextView 控件学习
以下图片都来自于B站视频,仅留作学习记录,方便复习 视频链接 代码练习 <LinearLayout android:layout_width="match_parent" a ...
- PolarCTF网络安全2025春季个人挑战赛 web方向个人wp
xCsMsD 首先注册,注册后登录,显示一个xss窗口和一个cmd窗口,可以输入xss代码和命令执行指令 首先命令执行ls发现能够正确显示当前目录文件 然后尝试ls /发现没有回显,这时应该猜测是有过 ...
- idea里面怎么把自己项目添加maven
首先你要清楚什么是maven: maven项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的项目管理工具软件.Maven 除了以程序构建能力为特色之外,还提供高级项目管理工具 ...
- pytorch入门 - VGG16神经网络
1. VGG16背景介绍 VGG-16是由牛津大学Visual Geometry Group(VGG)在2014年提出的深度卷积神经网络模型,它在当年的ImageNet大规模视觉识别挑战赛(ILSVR ...
- 学习php,整了一个php小马:无用小马项目介绍
主要实现了几个功能:1.嗅探文件.可以嗅探服务器上的文件 2.大马上传.可以拿来传大马,既可以选择直接上传文件,也可以选择保存到小马上传地址. 3.打算还加一些好用的功能,比如说修改php.ini之类 ...
- 那些年拿过的shell之adminer
扫敏感文件扫到一个adminer 第三次遇到了,先看版本4.2.5比较低可以利用mysql服务端读客户端文件漏洞(高版本修复了). 通过报错得到这个站是linux.虚拟主机.thinkphp3.绝对路 ...
- AI应用实战课学习总结(3)预测带货销售额
大家好,我是Edison. 最近入坑黄佳老师的<AI应用实战课>,记录下我的学习之旅,也算是总结回顾. 今天是我们的第3站,了解下AI项目实践的5大环节,并通过一个预测直播带货销售额的案例 ...