SpringBoot+Vue项目的配置异常处理的两种方式(以注册用户功能非法参数为例)

SpringBoot+Vue项目的配置异常处理的两种方式(以注册用户功能非法参数为例)

前提场景

现在有一个SpringBoot+Vue的项目的注册用户的功能,假设要求用户输入的账号密码不能为空,若用户输入了空值,应当提示用户名 或 密码 不能为空,而不是直接弹出错误页面,如下图为幽络源某系统的注册界面以及不处理异常时出现异常的界面。

QQ_1742048544068

在如上登录页,用户不填写任何值,直接点击注册,但后端又不允许空值因此直接抛出异常,前后端都不做处理的话就会弹出如下红色报错框,这显然是不友好的

QQ_1742048625153

处理的两种方案

方案一:后端只抛异常,前端捕获并提示

方案二:后端抛异常且统一处理响应,前端根具响应码提示(这里以响应码为1表示成功,0表示失败)

方案一:后端只抛异常,前端捕获并提示

如下图,在后端接口中,后端对于空值以及null做了非法参数异常抛出

QQ_1742049453684

如下图,我们先在catch捕获块先输出一下异常对象的信息

QQ_1742049519502

现在我们再不填写任何信息注册用户并查看控制台信息,可以看到,在捕获到的异常对象中,后端传入的信息在对象的response ->  data -> message 中,并且可以看到此时的界面已经不再是上边提到的非人性化的红色报错框

QQ_1742049730042

因此,前端这里捕获到异常后,可以通过  elementui 语法输出后端异常对象中的 message,如图

QQ_1742050037321

QQ_1742050086037

如上,以前端为主的异常处理解决了直接弹出红色报错框的问题,但是在 浏览器的开发者工具的控制台以及网络中的红色报错可能有的开发者认为这样仍然不是很完美,下面看以后端处理为主的方式。

方案二:后端抛异常且统一处理响应,前端根具响应码提示

后端注册用户接口不变,仍为如下图

QQ_1742049453684

在后端,我们配置个全局异常处理拦截器,因为此接口我们可以看到所抛出的异常为 IllegalArgumentException ,也就是非法参数异常,在config包下新建文件名为GlobalExceptionHandler的java文件,加入如下代码(需要注意的是在我这个系统中,用的统一响应体为自定义的Res对象,且以1为成功响应,0为失败响应,可自行更换或使用下方我的响应对象)

import com.back.utils.Res;
import org.springframework.web.bind.annotation.ExceptionHandler;
import org.springframework.web.bind.annotation.RestControllerAdvice;

@RestControllerAdvice
public class GlobalExceptionHandler {

    /**
     * 非法参数异常全局拦截器
     * @param ex 异常对象
     * @return
     */
    @ExceptionHandler(IllegalArgumentException.class)
    public Res<String> handleIllegalArgumentException(IllegalArgumentException ex) {
        return new Res(0,ex.getMessage());
    }
}

如果你需要我的统一响应对象,可copy如下:

public class Res<T> {
    /**
     * 状态码 0失败 1成功
     */
    private Integer code;
    /**
     * 提示信息,如果有错误时,前端可以获取该字段进行提示
     */
    private String msg;
    /**
     * 查询到的结果数据,
     */
    private T data;
    public Res(Integer code, String msg) {
        this.code = code;
        this.msg = msg;
    }
    public Res(Integer code, T data) {
        this.code = code;
        this.data = data;
    }
    public Res(Integer code, String msg, T data) {
        this.code = code;
        this.msg = msg;
        this.data = data;
    }
    public Integer getCode() {
        return code;
    }
    public void setCode(Integer code) {
        this.code = code;
    }
    public String getMsg() {
        return msg;
    }
    public void setMsg(String msg) {
        this.msg = msg;
    }
    public T getData() {
        return data;
    }
    public void setData(T data) {
        this.data = data;
    }
}

如图

QQ_1742050665125

在前端中,这里就无需再捕获异常了,因为后端的全局异常处理已经将其捕获并统一返回了响应,因此代码改为如下图

QQ_1742050887258

ok,现在来测试空值注册,看看效果

QQ_1742051246118

可以看到,如上图,前端正常的弹出了提示信息,且在控制台以及网络不再有红色的错误信息,这是一种比较推荐的方式。

结语

以上是幽络源的全栈教程=>SpringBoot+Vue项目的配置异常处理的两种方式(以注册用户功能非法参数为例),如有不懂之处,或对全栈技术感兴趣的可以加入我们的QQ群307531422 交流。

© 版权声明
THE END
喜欢就支持一下吧
分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称

    暂无评论内容