ruoyi前后端分析-参数验证

前端参数验证

触发验证

• 进入 系统管理 --> 用户管理,选择第二条数据进行点击修改,将用户昵称修改为空则提示"用户昵称不能为空"

代码分析

• 参数说明:
  • required: true: 表示必须输入
  • message: 设置不符合校验规则的提示信息
  • trigger: 设置校验的触发方式 – blur: 表示在失去焦点时触发
• 因此,用户昵称为必须输入的一个参数,不能为空,否则会提示"用户昵称不能为空",如[触发验证]展示

后端参数验证

触发验证

• 进入 系统管理 -> 用户管理,选择列表中第二条数据进行修改,修改用户昵称使用户昵称的长度大于30,点击确定按钮提示报错信息
  

代码分析

• 前端
  • 处理参数
    前端在数据输入时进行了最大长度的限制,因此想要有上图的效果,需要删除掉下图指定内容
    
  • 修改参数使参数>30,点击确定发送请求
    用户昵称为1234567890123456789012345678901,点击确认
    
    点击确认时,通过源码发现触发了submitForm()方法
    
  • 参数校验,并且发送请求到后端
    表单校验无误后,通过updateUser函数对url为 /system/user 发送 HTTP PUT 请求,请求数据为data
    
    
  • 处理后端返回信息
    前端对后端返回的信息进行拦截,返回code == 500 时,输出错误的消息框,指定消息显示内容为后端返回的msg信息
• 后端
  • controller代码
    @Validated: 告诉系统SysUser需要进行参数验证,因此前端发送请求时,进行拦截并对接收对象的每个属性进行校验
    
    
  • 实体类校验注解
    类对属性的限制,其中@Xss注解为自定义参数验证注解
    当nickName不符合这两个注解限制中的其中一个时,则会抛出异常
    
  • 处理异常
    控制台查看报错信息
    通过报错信息,在异常处理器中查找指定异常处理方法
    @ExceptionHandler: 用于指定异常处理方法
    

后端自定义(参数验证)注解

• 新增注解NotNumber,设置自定义注解器NotNumberValidator.class
  @Constraint: 标记注解为自定义约束注解。validatedBy用于指定实现了ConstraintValidator接口的验证器类，用于验证注解标记的字段或参数是否复合自定义的校验规则
  
• 自定义注解器NotNumberValidator,实现ConstraintValidator接口
  该类实现ConstraintValidator接口，复写isValid()方法，通过正则表达式进行参数合理化验证
  
• 实体类使用自定义注解NotNumber
  
• 前后端展示