目录
[🧩 首先进行前端校验 ------（满足用户体验）](#🧩 首先进行前端校验 ——（满足用户体验）)
🧠第五步：定位到前端拦截器源码------request.js:101:1
[🧩 其次进行后端校验 ------（为了系统安全）](#🧩 其次进行后端校验 ——（为了系统安全）)
🧠第二步：校验阶段------Spring看到@Validated-->自动化校验SysRole字段
[🧠第四步：找到"全局异常处理器"------RuoYi 项目中所有异常的"总拦截器"](#🧠第四步：找到“全局异常处理器”——RuoYi 项目中所有异常的“总拦截器”)
[1.2 、📍若依中其他异常校验------以添加岗位为例](#1.2 、📍若依中其他异常校验——以添加岗位为例)
[🧩 首先进行前端校验 ------（满足用户体验）](#🧩 首先进行前端校验 ——（满足用户体验）)
🧠第五步：定位到前端拦截器源码------request.js:101:1
[🧩 其次进行后端校验 ------（为了系统安全）](#🧩 其次进行后端校验 ——（为了系统安全）)
🧠第二步：校验阶段------Spring看到@Validated-->自动化校验SysPost字段
[🧠第四步：找到"全局异常处理器"------RuoYi 项目中所有异常的"总拦截器"](#🧠第四步：找到“全局异常处理器”——RuoYi 项目中所有异常的“总拦截器”)
[🧪 常见校验注解（配合 @Validated 使用）](#🧪 常见校验注解（配合 @Validated 使用）)
🎯第三步：创建校验器NoSpecialCharsValidator
- 用户输入 → 数据传输 → 自动校验 → 异常捕获 → 错误提示
- 前端校验优先执行，后端进行二次校验（安全兜底）
1.1、📍以角色名称为例
🧩 首先进行前端校验 ------（满足用户体验）
🧠第一步：设计表单结构页面文件
- 路径：RuoYi-Vue-v3.8.2\ruoyi-ui\src\views\system\role\index.vue
🧠第二步：点击确定按钮（submitForm方法）
- 路径：RuoYi-Vue-v3.8.2\ruoyi-ui\src\views\system\role\index.vue
🧠第三步：触发表单校验规则（rules）
- 因为在第二步点击确定按钮会触发一个表达校验，所以需要提前写好表单校验规则
- 路径：RuoYi-Vue-v3.8.2\ruoyi-ui\src\views\system\role\index.vue
🧠第四步：使用开发者工具查看接口
🧠第五步：定位到前端拦截器源码------request.js:101:1
🧠小结
🧩 其次进行后端校验 ------（为了系统安全）
- 👏异常：当前端校验失败时，直接制止
- ？ 那么why要进行后端校验（防止黑客等直接绕过前端对数据进行修改或者直接使用postman等工具对后端进行校验.......即确保安全性）
🧠第一步：后端接收PUT/system/role请求
- 定位到后端api的system/role
🧠第二步：校验阶段------Spring看到@Validated-->自动化校验SysRole字段
🧠第三步：判断当前的控制台日志
- 说明
@Validated已经生效，抛出了MethodArgumentNotValidException
🧠第四步：找到"全局异常处理器"------RuoYi 项目中所有异常的"总拦截器"
🧠小结
1.2 、📍若依中其他异常校验------以添加岗位为例
🧩 首先进行前端校验 ------（满足用户体验）
🧠第一步：设计表单结构页面文件
- 路径：RuoYi-Vue-v3.8.2\ruoyi-ui\src\views\system\post\index.vue
🧠第二步：点击确定按钮（submitForm方法）
- 路径：RuoYi-Vue-v3.8.2\ruoyi-ui\src\views\system\post\index.vue
🧠第三步：触发表单校验规则（rules）
- 因为在第二步点击确定按钮会触发一个表达校验，所以需要提前写好表单校验规则
- 路径：RuoYi-Vue-v3.8.2\ruoyi-ui\src\views\system\post\index.vue
🧠第四步：使用开发者工具查看接口
🧠第五步：定位到前端拦截器源码------request.js:101:1
🧩 其次进行后端校验 ------（为了系统安全）
🧠第一步：后端接收POST/system/post请求
- 定位到后端api的system/post
🧠第二步：校验阶段------Spring看到@Validated-->自动化校验SysPost字段
🧠第三步：判断当前的控制台日志
🧠第四步：找到"全局异常处理器"------RuoYi 项目中所有异常的"总拦截器"
🧠完整流程回顾
| 步骤 | 代码位置 | 作用 |
|---|---|---|
| 1. 前端提交空角色名 | ruoyi-ui/src/views/system/role/form.vue |
发送 { roleName: "" } |
| 2. 后端接收请求 | SysRoleController.add() |
使用 @Validated @RequestBody SysRole role |
| 3. 触发校验 | SysRole.roleName 字段上的 @NotBlank |
检查是否为空 |
| 4. 抛出异常 | 自动抛出 MethodArgumentNotValidException |
不执行后续代码 |
| 5. 全局异常处理 | GlobalExceptionHandler.handleMethodArgumentNotValidException() |
返回 {"code":500, "msg":"角色名称不能为空"} |
| 6. 前端拦截器弹窗 | ruoyi-ui/src/utils/request.js |
弹出错误提示 |
🧪 常见校验注解（配合 @Validated 使用）
| 注解 | 作用 | 示例 |
|---|---|---|
@NotBlank |
字符串非 null 且非空（trim 后长度 > 0） | " " 也会报错 |
@NotNull |
不能为 null（但可以是空字符串） | "" 是允许的 |
@NotEmpty |
不能为 null 且长度 > 0（用于 List/String） | "" 不允许 |
@Email |
必须是合法邮箱 | "abc@gmail.com" ✅ |
@Size(min=2, max=10) |
长度限制 | 角色名 2~10 个字符 |
@Pattern(regexp = "...") |
正则匹配 | 只能字母数字 |
2、自定义一个参数验证注解
🎯目标：
- 当用户在"部门管理"中输入的部门名称包含非法字符（EG：@、#、$）时，自动出发校验失败，抛出异常，并返回友好错误提示
🎯第一步：理解"自定义校验注解"的组成
Spring Boot的JSR-303校验支持自定义注解，需要两个东西：
- 一个注解类 （eg:@NoSpecialChars）
- 一个校验器类 （实现ConstrainValidator接口）
注解类和校验器类的关系就像：
- "这个字段需要满足什么规则"------注解
- "怎么判断他是否满足"------校验器
🎯第二步：创建自定义注解@NoSpecialChars
🎯第三步：创建校验器NoSpecialCharsValidator
🎯第四步：在实体类上使用这个注解
- 我们需要校验的是岗位名称（postName）
现在postName有三个校验
- 不能为空（@NotBlank）
- 长度限制（@Size）
- 不能有特殊字符（@NoSpecialChars）
🎯第五步：测试效果
🎯总结：做了什么？
| 步骤 | 动作 | 关键点 |
|---|---|---|
| 1 | 创建注解 @NoSpecialChars |
定义规则"长什么样" |
| 2 | 创建校验器 NoSpecialCharsValidator |
定义"怎么判断" |
| 3 | 在 SysDept.deptName 上加注解 |
应用规则 |
| 4 | 测试提交非法数据 | 触发异常 |