若依(RuoYi)框架的介绍与基本使用

397 阅读7分钟

一. 若依(RuoYi)介绍

若依(RuoYi) 是一个基于 Spring Boot 权限管理系统 的 开源快速开发框架。它旨在为开发者提供一个功能完备、易于扩展、界面美观的后台管理系统解决方案,从而大幅节省基础功能的开发时间,让开发者能够专注于核心业务的实现。 若依是一套全部开源的快速开发平台,毫无保留给个人及企业免费使用。 在这里插入图片描述

  • 前端采用Vue、Element UI。
  • 后端采用Spring Boot、Spring Security、Redis & Jwt。
  • 权限认证使用Jwt,支持多终端认证系统。
  • 支持加载动态权限菜单,多方式轻松权限控制。
  • 高效率开发,使用代码生成器可以一键生成前后端代码。
  • 提供了技术栈(Vue3 Element Plus Vite)版本RuoYi-Vue3,保持同步更新。
  • 提供了单应用版本RuoYi-Vue-fast,Oracle版本RuoYi-Vue-Oracle,保持同步更新。
  • 不分离版本,请移步RuoYi,微服务版本,请移步RuoYi-Cloud

1.1 若依内置功能

用户管理:用户是系统操作者,该功能主要完成系统用户配置。 部门管理:配置系统组织机构(公司、部门、小组),树结构展现支持数据权限。 岗位管理:配置系统用户所属担任职务。 菜单管理:配置系统菜单,操作权限,按钮权限标识等。 角色管理:角色菜单权限分配、设置角色按机构进行数据范围权限划分。 字典管理:对系统中经常使用的一些较为固定的数据进行维护。 参数管理:对系统动态配置常用参数。 通知公告:系统通知公告信息发布维护。 操作日志:系统正常操作日志记录和查询;系统异常信息日志记录和查询。 登录日志:系统登录日志记录查询包含登录异常。 在线用户:当前系统中活跃用户状态监控。 定时任务:在线(添加、修改、删除)任务调度包含执行结果日志。 代码生成:前后端代码的生成(java、html、xml、sql)支持CRUD下载 。 系统接口:根据业务代码自动生成相关的api接口文档。 服务监控:监视当前系统CPU、内存、磁盘、堆栈等相关信息。 缓存监控:对系统的缓存信息查询,命令统计等。 在线构建器:拖动表单元素生成相应的HTML代码。 连接池监视:监视当前系统数据库连接池状态,可进行分析SQL找出系统性能瓶颈。

1.2 若依主要特性

  • 完全响应式布局(支持电脑、平板、手机等所有主流设备)
  • 强大的一键生成功能(包括控制器、模型、视图、菜单等)
  • 支持多数据源,简单配置即可实现切换。
  • 支持按钮及数据权限,可自定义部门数据权限。
  • 对常用js插件进行二次封装,使js代码变得简洁,更加易维护
  • 完善的XSS防范及脚本过滤,彻底杜绝XSS攻击
  • 支持CSRF跨站请求伪造防御,双重提交令牌验证
  • Maven多项目依赖,模块及插件分项目,尽量松耦合,方便模块升级、增减模块。
  • 国际化支持,服务端及客户端支持
  • 完善的日志记录体系简单注解即可实现
  • 支持服务监控,数据监控,缓存监控功能。

1.3 若依技术选型

1、系统环境 Java EE 8 Servlet 3.0 Apache Maven 3

2、主框架 Spring Boot 2.2.x Spring Framework 5.2.x Apache Shiro 1.7

3、持久层 Apache MyBatis 3.5.x Hibernate Validation 6.0.x Alibaba Druid 1.2.x

4、视图层 Bootstrap 3.3.7 Thymeleaf 3.0.x

演示地址:vue.ruoyi.vip 文档地址:doc.ruoyi.vip

二. 若依(RuoYi)项目搭建

2.1 后端搭建

地址:gitee.com/y_project/R…

点击克隆/下载,复制HTTPS的链接

在这里插入图片描述 在这里插入图片描述

点击从VCS获取 粘贴刚复制的地址( 第一次克隆可能会比较慢)

在这里插入图片描述 在这里插入图片描述 进去之后就是这个样子 在这里插入图片描述

!!!提示:如果模块没有被maven管理,没有高亮,则按照下面步骤做,点开maven管理,先点击clean,然后再package打包

在这里插入图片描述

  • 新建一个自己的数据库,我这里建的是名为RuoYi-Java的数据库

  • Java中有两个sql脚本,在你的数据库中分别执行这两个sql脚本

  • 执行完成后会出现30张表

在这里插入图片描述 在这里插入图片描述

ruoyi-admin/src/main/resource/application-druid.yml配置自己的数据库(注意配置自己的数据库名称和数据库密码)

            master:
                url: jdbc:mysql://localhost:3306/RuoYi-Java?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8
                username: root
                password: You-Password
  • 首先启动你的Redis数据库
  • ruoyi-admin/src/main/resource/application.yml中配置自己的Redis数据库(也是配置自己要用的数据库和密码)

在这里插入图片描述

  redis:
    # 地址
    host: localhost
    # 端口,默认为6379
    port: 6379
    # 数据库索引
    database: 2
    # 密码
    password:
    # 连接超时时间
    timeout: 10s
    lettuce:
      pool:
        # 连接池中的最小空闲连接
        min-idle: 0
        # 连接池中的最大空闲连接
        max-idle: 8
        # 连接池的最大数据库连接数
        max-active: 8
        # #连接池最大阻塞等待时间(使用负值表示没有限制)
        max-wait: -1ms

运行启动类RuoYiApplication 出现这个运行结果就说明若依后端搭建成功啦

在这里插入图片描述

因为用这个方法搭建的若依项目默认的是vue2的前端所以我们要自己去搭建若依的vue3前端

2.2 前端搭建

地址:gitee.com/ys-gitee/Ru…

在这里插入图片描述

同样是复制HTTPS的地址, 在VSCode克隆这个地址

在这里插入图片描述

在终端执行npm install安装依赖 再执行npm run dev运行前端界面

打开浏览器输入**http://localhost:80/**,看到这个界面你的若依框架就搭建完成啦!!! 在这里插入图片描述

三. 若依(RuoYi)的基本使用

3.1 数据准备

CREATE TABLE `tb_course` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '课程id',
  `code` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '课程编码',
  `subject` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '课程学科',
  `name` varchar(64) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '课程名称',
  `price` int DEFAULT NULL COMMENT '价格(元)',
  `applicable_person` varchar(32) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '适用人群',
  `info` varchar(255) CHARACTER SET utf8mb3 COLLATE utf8mb3_bin DEFAULT NULL COMMENT '课程介绍',
  `create_time` timestamp NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
  `update_time` timestamp NULL DEFAULT NULL COMMENT '更新时间',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=7 DEFAULT CHARSET=utf8mb3 COLLATE=utf8mb3_bin COMMENT='课程管理';

INSERT INTO `tb_course` VALUES (1,'cp123456','javaEE','JavaSE基础',199,'小白学员','JavaSE基础','2024-04-20 09:57:35','2024-04-20 09:57:35'),
                               (2,'cp123457','javaEE','JavaWeb',188,'初级开发者','JavaWeb','2024-04-20 09:57:35','2024-04-20 09:57:35'),
                               (3,'cp123458','Python+大数据','Python入门',555,'小白学员','Python入门','2024-04-20 09:57:35','2024-04-20 09:57:35'),
                               (4,'cp123459','Python+大数据','PythonWeb',88,'初级开发者','PythonWeb','2024-04-20 09:57:35','2024-04-20 09:57:35'),
                               (5,'cp123460','鸿蒙应用开发','鸿蒙入门',99,'小白学员','鸿蒙入门','2024-04-20 09:57:35','2024-04-20 09:57:35'),
                               (6,'cp123461','鸿蒙应用开发','鸿蒙商城实战',59,'初级开发者','鸿蒙商城实战','2024-04-20 09:57:35','2024-04-20 09:57:35');

3.2 代码生成

在代码生成中导入表格

在这里插入图片描述

编辑表格的基本信息,字段信息,生成信息

基本信息的实体类名称一般会把前缀删除

在这里插入图片描述

字段信息根据实际需求自行修改和保留

在这里插入图片描述

生成配置中生成包的路径和生成模块名要和你的前端后端代码保持一致

在这里插入图片描述

点击你刚刚的代码进行下载并解压缩,会有两个文件夹和一个sql脚本,main文件夹是Java代码,vue是前端代码,把sql脚本导入数据库

在这里插入图片描述 在sys_menu的表中检查是否导入成功 在这里插入图片描述

找到对应的位置导入前后端的包(main,vue) 重新启动前后端代码 增加了课程管理的基本CRUD

在这里插入图片描述