🔥博客主页: 【小扳_-CSDN博客】
❤感谢大家点赞👍收藏⭐评论✍
文章目录
1.0 若依框架概述
1.1 若依构建
1.2 后端项目搭建
1.3 前端项目搭建
2.0 利用若依框架生成前后端代码案例
3.0 功能详解
3.1 功能详解 - 权限控制
3.1.1 使用权限控制功能
3.2 功能详解 - 数据字典
3.2.1 使用数据字典功能
3.3 功能详解 - 其他功能
3.4 功能详解 - 监控相关
3.5 功能详解 - 定时任务
3.5.1 使用定时任务
3.6 功能详解 - 表单构建
3.6.1 通过图形化界面实现一个表单构建
3.7 功能详解 - 代码生成
3.7.1 根据树表模板来生成前后端代码
3.8 功能详解 - 系统接口
3.8.1 使用测试接口
4.0 若依项目结构
4.1 后端项目结构
4.2 后端项目配置信息
4.3 前端项目结构
5.0 若依生成的源代码
5.1 后端源码分析
1.0 若依框架概述
若依(RuoYi)框架是一个基于 Java 的开源企业级快速开发框架,主要用于构建信息管理系统。它结合了多种前端和后端技术,提供了高效的开发工具。
用到的技术栈:
1)后端:采用了 Spring Boot、MyBatis、Redis 等流行技术。
2)前端:使用 Vue3 框架,结合 ElementPlus 组件库,提供了现代化的用户界面。
模块化设计:
若依框架采用了模块化设计,支持多种功能模块的集成和扩展,如用户管理、角色管理、菜单管理等
1.1 若依构建
RuoYi-Vue 版本,采用了前后端分离的单体架构设计:
1)软件环境:JDK、MySQL、Redis、Maven、Node
2)技术选型:Spring Boot、Spring Security、MyBatis、Jwt、Vue3、Element-Plus
3)官方地址:
后端代码:https://gitee.com/y_project/RuoYi-Vue
前端代码:https://gitee.com/ys-gitee/ruoyi-vue3
4)官方推荐软件环境版本:
- JDK >= 1.8
- MySQL >= 5.7.0
- Redis >= 3.0
- Maven >= 3.0
- Node >= 12
以上的软件下载安装在之前的博客都有讲解到,需要了解的,可以到我的主页搜索。
1.2 后端项目搭建
1)Git 克隆并初始化项目
首先复制项目 URL:
接着在 IDEA 克隆项目:
在 IDEA 打开该项目:
2)MySQL 导入与配置
使用 SQL 脚本,执行 SQL 文件:
使用 MySQL 可视化工具执行 SQL 脚本:
在项目中选择 SQL 文件:
MySQL 导入完成之后,打开数据库可以看到生成了 30 张表:
再接着,在项目中对 MySQL 进行配置:
注意,选择了指定数据库执行 SQL 脚本,则就选择该数据库。一般来说,username 默认为 root 。
3)启动 Redis
直接在 Redis 目录下执行该命令即可。
接着在项目中配置 Redis,如果 Redis 没有设置密码,这一步就可以忽略了。对于设置了 Redis 密码,还需要在项目中配置密码:
4)运行后端项目
以上操作完成之后,就可以正常启动项目了:
正常运行状态:
1.3 前端项目搭建
1)Git 克隆并初始化项目
首先复制前端 URL:
接着克隆到本地:
2)安装依赖
先用 vs 工具打开前端项目:
再接着,安装依赖:
3)运行前端项目
最后启动项目:
运行结果:
2.0 利用若依框架生成前后端代码案例
先通过一个案例,来具体了解若依框架的强大之处。
利用若依代码生成器,生成课程管理的前后端代码。
1)准备 SQL 并导入数据库:
2)配置代码生成信息:
通过若依界面来配置代码:
对课程管理的功能进行配置信息:
基本信息:
字段信息:
根据具体的业务功能来进行选择配置。
生成信息:
3)下载代码并导入项目:
选择生成代码:
下载到本地之后,解压文件:
先执行 SQL 脚本,来导入数据库信息:
导入之后查看结果:
再接着将 main 文件导入到后端项目中:
最后将 vue 文件导入到前端项目:
重启一下后端项目,就可以看到课程管理页面的生成结果:
利用若依框架,根据配置信息,若依会自动生成前后端代码、数据库相关的表,从而得到一个增删改查的课程管理页面。
以上简单介绍了若依是如何根据一张数据库表以及配置信息来自动生成前后端代码、数据库表。
3.0 功能详解
除了可以根据表来快速生成前后端代码的功能以外,还有若依框架其他的功能。这些功能使得若依框架不仅仅是一个代码生成工具,而是一个完整的企业级管理系统开发框架,适用于各种类型的项目。它能够极大地提高开发效率,降低开发成本。
3.1 功能详解 - 权限控制
简单来说,管理员和普通用户所允许访问的菜单是不一样的,比如说管理员可以对普通用户的信息进行增删改查,而普通用户则不能具备该功能。因此,利用 RBAC 来通过角色来分配和管理用户的菜单权限。
RBAC 是基于角色的访问控制,是一种广泛使用的访问控制模型,通过角色来分配和管理用户的菜单权限。
RBAC 的主要组成部分包括:
1)角色:角色是权限的集合,定义了用户在系统中可以执行的操作。角色通常基于用户的工作职能、责任或其他相关标准。
2)用户:用户是被分配到角色的个人。用户继承与其所分配角色相关的权限。
3)权限:这是用户执行特定操作或访问特定资源所需的授权。权限通常分配给角色,而不是单独分配给用户。
若依使用了五张表将角色、用户和权限进行了关联,从而实现对权限的控制。
若依实现权限控制的思路:
用户登录之后,会根据用户信息查询角色,通过角色再来查询当前用户的权限。
3.1.1 使用权限控制功能
在若依页面来使用这个权限控制功能,比如说,之前完成的课程管理的功能,将其分配到对应的角色。
1)菜单管理:
将课程管理提升为主类目:
页面结果:
2)角色管理
创建角色来关联课程管理权限,简单来说,让该角色具备课程管理的权限。
3)用户管理
创建用户且分配角色。
接着来登录小板用户:
小板用户当前的课研人员的角色只有课程管理的权限,因此只能查看到课程管理功能。
3.2 功能详解 - 数据字典
若依内置的数据字典,用于维护系统中常见的静态数据。例如:性别、状态等等。功能包括了字典类型管理、字典数据管理。
若依通过两张表来维护:字典类型表、字典数据表
3.2.1 使用数据字典功能
在课程管理的功能中,课程学科是静态数据,因此可以使用数据字典功能进行升级改造。
1)添加字典类型
添加完之后:
2)添加字典数据
在课程学科中添加数据:
3)修改代码生成信息
将查询课程学科改为下拉框的形式查询:
下载代码之后,只需要将前端项目中的 course 进行替换即可:
打开页面:
成功修改了,将课程学科静态数据改为了字典数据。
最后,还要修改数据库中的信息:
演示结果:
3.3 功能详解 - 其他功能
简单介绍参数设置、通知公告、日志管理功能。
1)参数设置
对系统中的参数进行动态维护。
这些参数通过设置,不用修改代码,就可以执行。
比如说开启验证码功能,设置 false,既可以关闭验证功能。
再次登录看看:
此时没有验证码登录了。
同理,开启新用户注册功能:
为了方便,修改以下参数,就可以通过登录界面来注册新用户:
最终的结果:
2)通知公告
促进组织内部信息传递。这个功能属于半成品,实际上只实现了公告录入功能,没有实现发布、查看公告的功能。
3)日志管理
轻松追踪用户行为和系统运行状况。
查看用户登录信息:
查看用户操作信息:
这些信息都存在数据库表中。可以通过定时任务去清理日志,否则一段时间之后,数据库中的日志信息会非常庞大。
3.4 功能详解 - 监控相关
若依提供了一些强大的监控工具,能够帮助开发者和运维快速了解应用程序的性能状态。
在线用户:
缓存列表:
缓存监控:
服务监控:
数据监控:
该功能主要监控数据库的情况。
用户名和密码在配置文件中查看:
是一个集成到项目中的功能,该功能的实现由 Druid(德鲁伊)实现:
3.5 功能详解 - 定时任务
若依为定时任务功能提供方便友好的 web 界面,实现动态管理任务。
3.5.1 使用定时任务
1)创建任务类:
在 quartz 模块下的 task 类创建任务类:
具体的代码逻辑: 每次查看 redis 中的缓存 keys 数量
2)添加任务规则:
该操作直接在若依 web 界面完成。
具体的配置信息:
调用方法:使用了 Spring IOC 容器管理的 Bean 对象方式,通过类名开头小写.具体的方式名来调用。
cron 表达式:每 5 秒执行一次。
执行策略:放弃执行的意思当服务器宕机了,重新修复之后,放弃执行之前的定时任务,只执行当下的定时任务。
是否并发:只是一个查看 Redis keys 的数量,可以选择并发,效率高。
3)启动定时任务:
3.6 功能详解 - 表单构建
表单构建工具,只需要开发者通过图形界面和拖拽等操作,可以快速构建复杂的表单。
3.6.1 通过图形化界面实现一个表单构建
1)构建表单结构并导出:
根据业务需求来设置表单结构,通过拉拽所需要的组件即可。
构建完之后,就可以导入 vue 文件了。
2)导入到前端项目:
更名为 add.vue 文件,接着就导入到 views/course/course 目录下。
3)创建菜单:
组件路径需要根据当前视图文件来编写,当前的添加课程功能的组件位于 course/course/add 中。
最后的结果:
这就在项目中创建了表单结构。
3.7 功能详解 - 代码生成
代码生成器,根据数据库表结构自动生成前后端 CRUD 代码。
在此之前介绍过根据课程表来自动生成 CRUD 代码。课程是单表,除了单表之外,还有多表。比如说树表、主子表(一对多)。
3.7.1 根据树表模板来生成前后端代码
树表是一种展示层级数据的表格,能展开折叠,清晰呈现父子关系,便于管理。比如部门管理结构:
接下来,演示依据树表模板是如何自动生成前后端的 CRUD 代码:
1)导入表结构:
2)配置信息:
根据表结构来配置:
生成模板:由于部门表是具备层级结构。
树编码字段:主键 ID 。
树父编码:外键 ID 。
树名称字段:展示字段名。
3)下载代码并导入项目中:
最后结果:
3.8 功能详解 - 系统接口
Swagger,是一个集成到项目中的工具,能够自动生成 API 的同步在线文档,并提供 web 界面进行接口调用和测试。
在项目中,提供了一个测试类:
该测试类上的类加上了 @Api 注解,在方法上加上了 @ApiOperation 注解,因此,才会自动生成对应的测试用例。
3.8.1 使用测试接口
先获取到 token 令牌:
再粘贴到 Authorize 中:
测试方法:
再接着配置后端项目中 Swagger 路径前缀信息:
测试结果:
4.0 若依项目结构
对于若依项目的结构进行分析,包含后端项目结构、前端项目结构。
4.1 后端项目结构
后端项目主要分成六个模块。
1)ruoyi-admin:
ruoyi-admin 是后台服务。
web:通用功能的 controller 。
RouYiApplication、RouYiServletInitializer:项目启动类。
2)ruoyi-common:
ruoyi-common 是通用工具。
- annotation:自定义注解
- config:全局配置
- constant:通用常量
- core:核心控制
- enums:通用枚举
- exception:通用异常
- filter:过滤器处理
- utils:通用工具类
- xss:自定义 xss 校验
3)ruoyi-framework:
ruoyi-framework 是框架核心。
- aspectj:自定义 AOP
- config:系统配置
- datasource:多数据源
- interceptor:拦截器处理
- manager:异步处理
- security:权限控制
- wed:前端控制
4)ruoyi-system:
ruoyi-system 是系统模块。
5)ruoyi-generator、ruoyi-quartz:
ruoyi-generator 为代码生成、ruoyi-quartz 为定时任务。
4.2 后端项目配置信息
- i18n:国际化处理
- META-INF:项目元信息,无需修改
- mybatis:mybatis 相关的配置
- application.yml:项目中的核心配置
- application-druid.yml:数据库连接配置
- banner.txt:项目启动,控制台打印显图案信息
- logback.xml:日志相关配置
模块依赖关系:
4.3 前端项目结构
- node_modules:第三方依赖库
- src:源代码存放目录(主要写代码的文件夹)
- package.json:项目配置文件,包括项目名、版本号、依赖包等
- vite.config.js:Vue 项目的配置信息,如:端口号等
src 具体内容:
- api:所有请求(向后端发送的 api)
- assets:静态资源,存放图片、字体
- components:通用组件
- router:路由,组件跳转
- views:Vue 组件页面
- App.vue:根组件
- main.js:入口文件,加载组件,初始化等
5.0 若依生成的源代码
5.1 后端源码分析
1)利用之前生成课程管理功能的源代码进行分析:
2)首先进入三层架构中的 controller 层:
接着对查询课程管理列表方法进行代码分析。
3)注解 @PreAuthorize 权限分析
对于注解 @PreAuthorize("@ss.hasPermi('course:course:list')") 起到一个权限控制。@PreAuthorize 注解是 Spring Security 框架中用来做权限检查的。它在运行方法之前先验证权限,权限够就放行,不够就拦截。
而 'course:course:list' 提供权限标识,在之前的 RBAC 基于角色访问控制中,'course:course:list' 对一个功能进行唯一标识,不同角色有不同的访问功能的权限,将角色赋给不同的用户,则用户也就有了不同的访问功能的权限。
在数据库中若依项目的 sys_menu 表:
不同的权限标识对应着不同的功能:
权限控制流程:
首先,用户登录会立即获取到该用户的信息,包含基本信息,比如说用户名称、用户 ID等。还包含角色集合、权限集合。一个用户可以有多个角色,每一个角色都会有具体的权限集合,也就是可以访问的功能集合。每当用户去操作的时候,操作之前,通过 @PreAuthorize() 注解拦截,查看该用户是否有该权限访问。
如果该用户权限列表中不存在该方法所对应的权限标识,则拒绝访问;如果该用户权限列表中存在该方法权限标识,则放行。
4)BaseController 基础控制层
web 层通用数据处理,项目中的 Controller 层都继承了 BaseController 类。
BaseController 类的变量和方法:
当前方法就用到了 startPage() 方法:
用到了父类 BaseController 类的 startPage() 方法。
接下来,查看 startPage() 方法的具体实现:
继续跟踪源码:
拿到请求中的当前 pageNum 页码数、pageSize 页码总数、orderBy 排序方式,接着调用 PageHelper.startPage() 第三方实现的方法。
当执行该行代码的时候,会被 PageHelper.startPage() 方法进行 "拦截",
拦截之后,接着会做两件事:第一, "select count(*) from 目的表名" 先获取 total 总数;第二,"select 目标字段 from 目标表名 where 条件 limit 起始页,展示数量" 给查询语句加上 "limit" 语句,从而来实现分页目的。
再接着往下走,
将查询的结果,交给了 getDataTable() 方法,该方法也是 BaseController 父类的方法:
首先创建了一个 TableDataInfo 类,该类的变量有 code、msg、row、total:
将分页的 total 总数、分页结果 list 封装到 TableDataInfo 类中,最后将类返回。
这就是课程管理中,分页查询的源代码所涉及到类、方法等。
5)对课程管理中获取课程管理详细信息进行分析:
同理,通过 @PreAuthorize() 注解进行拦截,查看该用户是否有权限访问该功能,若通过之后,根据路径参数来获取 id 。
接着调用 service 层中的 selectCourseById(id) 方法:
进入到 service 层,再调用 mapper 层中的 selectCourseById(id) 方法:
从数据库根据 id 获取到课程信息之后,将其一层一层返回出来。到 Controller 层,将结果交给 success(Object data) 父类的方法。
success(Object data) 方法:
再接着,又将 data 交给 AjaxResult.success() 方法:
AjaxResult 类用于返回给前端所需要的字段,该类对结果进行了封装。
AjaxResult 类中的 success(data) 方法:
以上的方法会调用以下 AjaxResult 类中的方法:
这就是课程管理中根据 id 来查询课程的详细信息的完整方法。之后的功能方法,所用到的类、方法都十分类似。
6)BaseEntity 基类:
每一个实体类都会继承该 BaseEntity 基类。
BaseEntity 基类变量、方法:
若依认为,每一个实体类都应该具备 searchValue、createBy、createtime、updateBy、updateTime、remark、params 字段。
所以每一个实体类都应该继承 BaseEntity 类。
小结:
1)BaseController:web 层通用数据处理。提供了丰富的方法,比如:分页所涉及到的方法。
2)TableDataInfo:用于将分页结果进行了封装,将封装好的字段返回给前端。
3)AjaxResult:操作消息提醒,用于将非分页结果进行封装,将封装好的字段返回给前端。
4)BaseEntity:Entity 基类。