1、项目结构
1.1 后端结构说明

ruoyi-cloud
├── ruoyi-api
│ └── ruoyi-api-system // 提取出来的openfeign的接口
├── ruoyi-auth // 认证授权
├── ruoyi-common // 通用工具模块
│ └── core // 核心控制
│ └── datascope //
│ └── datasource // 数据权限
│ └── log // 全局日志
│ └── redis // redis配置
│ └── seata //
│ └── security // 权限控制
│ └── sensitive //
│ └── swagger // 接口文档
├── ruoyi-gateway // 网关模块
├── ruoyi-modules // 系统模块
│ └── file // 文件相关
│ └── gen // 代码生成
│ └── job // 定时任务
│ └── system // 系统代码
├── ruoyi-visual
│ └── ruoyi-monitor // 监控模块
1.2 前端结构说明

├── build // 构建相关
├── bin // 执行脚本
├── public // 公共文件
│ ├── favicon.ico // favicon图标
│ └── index.html // html模板
│ └── robots.txt // 反爬虫
├── src // 源代码
│ ├── api // 所有请求
│ ├── assets // 主题 字体等静态资源
│ ├── components // 全局公用组件
│ ├── directive // 全局指令
│ ├── layout // 布局
│ ├── router // 路由
│ ├── store // 全局 store管理
│ ├── utils // 全局公用方法
│ ├── views // view
│ ├── App.vue // 入口页面
│ ├── main.js // 入口 加载组件 初始化等
│ ├── permission.js // 权限管理
│ └── settings.js // 系统配置
├── .editorconfig // 编码格式
├── .env.development // 开发环境配置
├── .env.production // 生产环境配置
├── .env.staging // 测试环境配置
├── .eslintignore // 忽略语法检查
├── .eslintrc.js // eslint 配置项
├── .gitignore // git 忽略项
├── babel.config.js // babel.config.js
├── package.json // package.json
└── vue.config.js // vue.config.js
2、项目运行
2.1 初始化数据库(建库建表)

在拉取的代码中,有SQL,即可找到数据库表。
1、创建数据库ry-cloud并导入数据脚本ry_2021xxxx.sql(必须),quartz.sql(可选)
2、创建数据库ry-config并导入数据脚本ry_config_2021xxxx.sql(必须)
3、创建数据库ry_seata并导入数据脚本ry_seata_2021xxxx.sql(可选)
2.2 完成注册中心(nacos)的配置和启动
2.2.1 下载nacos、解压、改配置
解压下载好的nacos压缩包,打开nacos文件夹找到conf文件夹下的application.properties并修改以下配置

2.2.2 启动
修改好配置以后返回上一级目录找到bin目录并进入找到 startup.cmd 文件、在此目录下进入cmd执行:startup.cmd -m standalone 启动nacos,启动成功后浏览器打开
http://localhost:8848/nacos登录的用户名和密码都为nacos

此时项目中的所有的配置文件都会显示,然后从上往下挨个编辑,把涉及到连接Mysql和Redis的所有地方,改为自己对应的用户名和密码。
2.3 reids安装启动
略
2.4 后端项目启动

2.5 启动前端项目

3、模块梳理
3.1 ruoyi-gateway

3.1.1 config
1)properties包(配置类信息):CaptchaProperties(读取nacos配置中心的验证码配置信息)、IgnoreWhiteProperties(读取nacos配置中心的放行白名单配置信息)、XssProperties(读取nacos配置中心的XSS跨站脚本配置信息)
2)CaptchaConfig:验证码的配置
3)GatewayConfig:网关限流配置
4)KaptchaTextCreator:验证码文本生成器
5)RouterFunctionConfiguration:路由配置(当接收到 /get的请求以及 ediaType.TEXT_PLAIN的时候调用获取验证码的handler方法)
@SuppressWarnings("rawtypes")
@Bean
public RouterFunction routerFunction()
{
return RouterFunctions.route(
RequestPredicates.GET("/code").and(RequestPredicates.accept(MediaType.TEXT_PLAIN)),
validateCodeHandler);
}
@Override
public Mono<ServerResponse> handle(ServerRequest serverRequest)
{
AjaxResult ajax;
try
{
ajax = validateCodeService.createCaptcha();
}
catch (CaptchaException | IOException e)
{
return Mono.error(e);
}
return ServerResponse.status(HttpStatus.OK).body(BodyInserters.fromValue(ajax));
}
6)SpringDocConfig:文档的配置类
3.1.2 filter
1) AuthFilter:网关鉴权(可通过nacos配置白名单、基本的鉴权验证、判断令牌的状态)
2)BlackListUrlFilter:黑名单过滤器(通过获取请求中的url判断是否是nacos上设置的黑名单)
3)CacheRequestFilter:获取body的请求数据(解决流不能重复读取问题)
4)ValidateCodeFilter:验证码过滤器
5)XssFilter:跨站脚本过滤器
3.1.3 handler
1)GatewayExceptionHandler:网关统一异常处理
2)SentinelFallbackHandler:自定义限流异常处理
3)ValidateCodeHandler:验证码获取
4)ValidateCodeServiceImpl:验证码实现处理
3.2 ruoyi-auth

主要用于做认证授权(登录、注册、登出、密码、登录日志、令牌刷新)
3.3 ruoyi-system

主要业务模块,和平时的boot差不多,实现三层架构
4、新建模块
4.1 创建新模块ruoyi-test:
这里在ruoyi-modules目录下新建test模块并新增界面,可参考ruoyi-system模块的目录结构及命名

4.2 进行新模块代码的基础配置调整:
修改ruoyi-test下的pom文件,参考ruoyi-system模块,可复制ruoyi-system的pom文件内容,修改system相关字段即可;
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://maven.apache.org/POM/4.0.0"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<parent>
<groupId>com.ruoyi</groupId>
<artifactId>ruoyi-modules</artifactId>
<version>3.6.5</version>
</parent>
<modelVersion>4.0.0</modelVersion>
<artifactId>ruoyi-modules-test</artifactId>
<description>
ruoyi-modules-test测试模块
</description>
<dependencies>
<!-- SpringCloud Alibaba Nacos -->
<dependency>
<groupId>com.alibaba.cloud</groupId>
<artifactId>spring-cloud-starter-alibaba-nacos-discovery</artifactId>
</dependency>
<!-- SpringCloud Alibaba Nacos Config -->
<dependency>
<groupId>com.alibaba.cloud</groupId>
<artifactId>spring-cloud-starter-alibaba-nacos-config</artifactId>
</dependency>
<!-- SpringCloud Alibaba Sentinel -->
<dependency>
<groupId>com.alibaba.cloud</groupId>
<artifactId>spring-cloud-starter-alibaba-sentinel</artifactId>
</dependency>
<!-- SpringBoot Actuator -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-actuator</artifactId>
</dependency>
<!-- Mysql Connector -->
<dependency>
<groupId>com.mysql</groupId>
<artifactId>mysql-connector-j</artifactId>
</dependency>
<!-- RuoYi Common DataSource -->
<dependency>
<groupId>com.ruoyi</groupId>
<artifactId>ruoyi-common-datasource</artifactId>
</dependency>
<!-- RuoYi Common DataScope -->
<dependency>
<groupId>com.ruoyi</groupId>
<artifactId>ruoyi-common-datascope</artifactId>
</dependency>
<!-- RuoYi Common Log -->
<dependency>
<groupId>com.ruoyi</groupId>
<artifactId>ruoyi-common-log</artifactId>
</dependency>
<!-- RuoYi Common Swagger -->
<dependency>
<groupId>com.ruoyi</groupId>
<artifactId>ruoyi-common-swagger</artifactId>
</dependency>
</dependencies>
<build>
<finalName>${project.artifactId}</finalName>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<executions>
<execution>
<goals>
<goal>repackage</goal>
</goals>
</execution>
</executions>
</plugin>
</plugins>
</build>
</project>
修改ruoyi-modules下的pom文件,增加 ruoyi-test 代码,参考ruoyi-system部分;
<module>ruoyi-test</module>
参考ruoyi-system模块修改TestApplication启动类代码,新增相关注解即可,如下:
@EnableCustomConfig
@EnableRyFeignClients
对于resources可复制ruoyi-system模块文件进行调整

4.3 在nacos进行新模块的配置管理
登录nacos:http://localhost:8848/nacos/
账号密码:nacos
克隆 ruoyi-system-dev.yml
命名为 ruoyi-test-dev.yml

点击编辑,修改下方的mybatis.typeAliasesPackage,改为 test,发布。如下:
mybatis:
# 搜索指定包别名
typeAliasesPackage: com.ruoyi.test
# 配置mapper的扫描,找到所有的mapper.xml映射文件
mapperLocations: classpath:mapper/**/*.xml
修改 ruoyi-gateway-dev.yml,添加新增的模块,发布。
# 测试服务
- id: ruoyi-test
uri: lb://ruoyi-test
predicates:
- Path=/test/**
filters:
- StripPrefix=1
4.4 新增测试表,生成代码,并进行前后端代码的修改和使用
4.4.1 创建测试表student,设置字段注释;

4.4.2 在系统界面生成代码,生成的后端代码参考其他们模块的目录结构进行复制粘贴,修改mapper等各层级的代码,消除bug,保证后端各方法到持久层的正常跳转;如下:

前端代码包括.vue文件和.js文件,可参考system模块在ruoyi-ui的views和api文件下创建新增自己的模块代码,这里js文件包含各接口路径,需要保证是自己模块路径。
4.5 进行界面菜单配置,启动新建的模块,重启前端vue界面,登录查看新模块基础界面及功能。
菜单配置可参考system模块样式进行路径及权限标识,按钮等的配置即可;

启动新建的模块,重启前端vue界面,可查看测试模块的基础功能。如下:


1万+






