`

(转)不错的前后端处理异常的方法

 
阅读更多
前言
在 Web 开发中, 我们经常会需要处理各种异常, 这是一件棘手的事情, 对于很多人来说, 可能对异常处理有以下几个问题:

什么时候需要捕获(try-catch)异常, 什么时候需要抛出(throws)异常到上层.
在 dao 层捕获还是在 service 捕获, 还是在 controller 层捕获.
抛出异常后要怎么处理. 怎么返回给页面错误信息.
异常处理反例
既然谈到异常, 我们先来说一下异常处理的反例, 也是很多人容易犯的错误, 这里我们同时讲到前端处理和后端处理 :

捕获异常后只输出到控制台
前端代码

$.ajax({
    type: "GET",
    url: "/user/add",
    dataType: "json",
    success: function(data){
        alert("添加成功");
    }
});
后端代码

try {
    // do something
} catch (Exception e) {
    e.printStackTrace();
}
这是见过最多的异常处理方式了, 如果这是一个添加商品的方法, 前台通过 ajax 发送请求到后端, 期望返回 json 信息表示添加结果. 但如果这段代码出现了异常:

那么用户看到的场景就是点击了添加按钮, 但没有任何反应(其实是返回了 500 错误页面, 但这里前端没有监听 error 事件, 只监听了 success 事件. 但即使加上了error: function(data) {alert("添加失败");}) 又如何呢? 到底因为啥失败了呢, 用户也不得而知.
后台 e.printStackTrace() 打印在控制台的日志也会在漫漫的日志中被埋没, 很可能会看不到输出的异常. 但这并不是最糟的情况, 更糟糕的事情是连 e.printStackTrace() 都没有, catch 块中是空的, 这样后端的控制台中更是什么都看不到了, 这段代码会像一个隐形的问题一样一直埋伏在系统中.
混乱的返回方式
前端代码

$.ajax({
    type: "GET",
    url: "/goods/add",
    dataType: "json",
    success: function(data) {
        if (data.flag) {
            alert("添加成功");
        } else {
            alert(data.message);
        }
    },
    error: function(data){
        alert("添加失败");
    }
});
后端代码

@RequestMapping("/goods/add")
@ResponseBody
public Map add(Goods goods) {
    Map map = new HashMap();
    try {
        // do something
        map.put(flag, true);
    } catch (Exception e) {
        e.printStackTrace();
        map.put("flag", false);
        map.put("message", e.getMessage());
    }
    reutrn map;
}
这种方式捕获异常后, 返回了错误信息, 且前台做了一定的处理, 看起来很完善? 但用 HashMap 中的 flag 和 message 这种字符串来当键很容易处理, 例如你这里叫 message, 别人起名叫 msg, 甚至有时手抖打错了, 怎么办? 前台再改成 msg 或其他的字符?, 前端后端这样一直来回改?
更有甚者在情况 A 的情况下, 返回 json, 在情况 B 的情况下, 重定向到某个页面, 这就更乱了. 对于这种不统一的结构处理起来非常麻烦.

异常处理规范
既然要进行统一异常处理, 那么肯定要有一个规范, 不能乱来. 这个规范包含前端和后端.

不要捕获任何异常
对的, 不要在业务代码中进行捕获异常, 即 dao、service、controller 层的所以异常都全部抛出到上层. 这样不会导致业务代码中的一堆 try-catch 会混乱业务代码.

统一返回结果集
不要使用 Map 来返回结果, Map 不易控制且容易犯错, 应该定义一个 Java 实体类. 来表示统一结果来返回, 如定义实体类:

public class ResultBean<T> {
    private int code;
    private String message;
    private Collection<T> data;

    private ResultBean() {

    }

    public static ResultBean error(int code, String message) {
        ResultBean resultBean = new ResultBean();
        resultBean.setCode(code);
        resultBean.setMessage(message);
        return resultBean;
    }

    public static ResultBean success() {
        ResultBean resultBean = new ResultBean();
        resultBean.setCode(0);
        resultBean.setMessage("success");
        return resultBean;
    }

    public static <V> ResultBean<V> success(Collection<V> data) {
        ResultBean resultBean = new ResultBean();
        resultBean.setCode(0);
        resultBean.setMessage("success");
        resultBean.setData(data);
        return resultBean;
    }

    // getter / setter 略
}
正常情况: 调用 ResultBean.success() 或 ResultBean.success(Collection<V> data), 不需要返回数据, 即调用前者, 需要返回数据, 调用后者. 如:
@RequestMapping("/goods/add")
@ResponseBody
public ResultBean<Goods> getAllGoods() {
    List<Goods> goods = goodsService.findAll();
    return ResultBean.success(goods);
}
@RequestMapping("/goods/update")
@ResponseBody
public ResultBean updateGoods(Goods goods) {
    goodsService.update(goods);
    return ResultBean.success();
}
一般只有查询方法需要调用 ResultBean.success(Collection<V> data) 来返回 N 条数据, 其他诸如删除, 修改等方法都应该调用 ResultBean.success(), 即在业务代码中只处理正确的功能, 不对异常做任何判断. 也不需要对 update 或 delete 的更新条数做判断(个人建议, 实际需要根据业务). 只要没有抛出异常, 我们就认为用户操作成功了. 且操作成功的提示信息在前端处理, 不要后台返回 “操作成功” 等字段.

前台接受到的信息为:

{
    "code": 0,
    "message": "success",
    "data": [
        {
            "name": "商品1",
            "price": 50.00,
        },
        {
            "name": "商品2",
            "price": 99.99,
        }
    ]
}
抛出异常: 抛出异常后, 我们应该调用 ResultBean.error(int code, String message), 来将状态码和错误信息返回, 我们约定 code 为 0 表示操作成功, 1 或 2 等正数表示用户输入错误, -1, -2 等负数表示系统错误.
前台接受到的信息为:

{
    "code": -1,
    "message": "XXX 参数有问题, 请重新填写",
    "data": null
}
前端统一处理:
返回的结果集规范后, 前端就很好处理了:

/**
* 显示错误信息
* @param result: 错误信息
*/
function showError(s) {
    alert(s);
}

/**
* 处理 ajax 请求结果
* @param result: ajax 返回的结果
* @param fn: 成功的处理函数 ( 传入data: fn(result.data) )
*/
function handlerResult(result, fn) {
    // 成功执行操作,失败提示原因
    if (result.code == 0) {
        fn(result.data);
    }
    // 用户操作异常, 这里可以对 1 或 2 等错误码进行单独处理, 也可以 result.code > 0 来粗粒度的处理, 根据业务而定.
    else if (result.code == 1) {
        showError(result.message);
    }
    // 系统异常, 这里可以对 -1 或 -2 等错误码进行单独处理, 也可以 result.code > 0 来粗粒度的处理, 根据业务而定.
    else if (result.code == -1) {
        showError(result.message);
    }
    // 如果进行细粒度的状态码判断, 那么就应该重点注意这里没出现过的状态码. 这个判断仅建议在开发阶段保留用来发现未定义的状态码.
    else {
        showError("出现未定义的状态码:" + result.code);
    }
}

/**
* 根据 id 删除商品
*/
function deleteGoods(id) {
    $.ajax({
        type: "GET",
        url: "/goods/delete",
        dataType: "json",
        success: function(result){
            handlerResult(result, deleteDone);
        }
    });
}

function deleteDone(data) {
    alert("删除成功");
}
showError 和 handlerResult 是公共方法, 分别用来显示错误和统一处理结果集.

然后将主要精力放在发送请求和处理正确结果的方法上即可, 如这里的 deleteDone 函数, 用来处理操作成功给用户的提示信息, 正所谓各司其职, 前端负责操作成功的消息提示更合理, 而错误信息只有后台知道, 所以需要后台来返回.

后端统一处理异常
说了这么多, 还没讲到后端不在业务层捕获任何异常的事, 既然所有业务层都没有捕获异常, 那么所有的异常都会抛出到 Controller 层, 我们只需要用 AOP 对 Controller 层的所有方法处理即可.

好在 Spring 为我们提供了一个注解, 用来统一处理异常:

@ControllerAdvice
@ResponseBody
public class WebExceptionHandler {

    private static final Logger log = LoggerFactory.getLogger(WebExceptionHandler.class);

    @ExceptionHandler
    public ResultBean unknownAccount(UnknownAccountException e) {
        log.error("账号不存在", e);
        return ResultBean.error(1, "账号不存在");
    }

    @ExceptionHandler
    public ResultBean incorrectCredentials(IncorrectCredentialsException e) {
        log.error("密码错误", e);
        return ResultBean.error(-2, "密码错误");
    }

    @ExceptionHandler
    public ResultBean unknownException(Exception e) {
        log.error("发生了未知异常", e);
        // 发送邮件通知技术人员.
        return ResultBean.error(-99, "系统出现错误, 请联系网站管理员!");
    }
}
在这里统一配置需要处理的异常, 同样, 对于未知的异常, 一定要及时发现, 并进行处理. 推荐出现未知异常后发送邮件, 提示技术人员.

总结
总结一下统一异常处理的方法:

不使用随意返回各种数据类型, 要统一返回值规范.
不在业务代码中捕获任何异常, 全部交由 @ControllerAdvice 来处理.
一个简单的演示项目: https://github.com/zhaojun1998/exception-handler-demo
分享到:
评论

相关推荐

    导出zip前后端完整方法

    - 在前后端都需要考虑异常处理,例如文件不存在、权限问题、IO异常等,确保程序的健壮性。 以上就是关于"导出zip前后端完整方法"的核心知识点。通过理解和应用这些技术,开发人员可以构建高效、安全的文件压缩和...

    Django之提交表单与前后端交互的方法

    ### Django之提交表单与前后端交互的方法 #### 一、引言 在现代Web开发中,前后端交互是至关重要的环节之一。特别是在基于Python的Web框架Django中,掌握如何实现前端表单数据的提交及后端处理,对于开发者来说至关...

    ruoyi框架前后端交互教程.docx

    request 这个方法,在 utils/request 下,普通的前后端交互,看 demo,axios 实例。 五、跨域处理 Ruoyi 框架前后端交互存在跨域问题(跨域就是端口不一样或域名不一样),前后端交互频繁,若服务器地址后期变更...

    springboot实现前后端分离项目

    本项目基于Spring Boot实现了后端接口,并结合Vue.js进行前端展示,同时利用axios处理跨域问题,提供了一个完整的前后端分离实践示例。 1. **Spring Boot**: Spring Boot是Spring框架的一个简化版,它简化了...

    SpringBoot + Shiro实现前后端全分离接口安全框架

    6. **会话管理**:虽然前后端分离通常避免使用服务器会话,但Shiro仍可处理会话相关的操作,如会话超时、会话固定攻击防护等。可以配置Shiro不使用默认的session管理,而是采用无状态的方式。 7. **异常处理**:...

    jQuery Ajax前后端使用JSON进行交互示例

    本篇文章主要介绍了jQuery Ajax前后端使用JSON进行交互示例,实现前端通过jQuery Ajax传输json到后端,后端接收json,对json进行处理,后端返回一个json给前端,有兴趣的可以了解一下。

    登录与注册界面的实现,同时实现前后端的交互功能

    总结,实现“登录与注册界面的实现,同时实现前后端的交互功能”涉及到了多个IT领域的知识,包括Spring框架、SpringMVC、MyBatis的使用,前端界面设计,以及安全性、异常处理和测试等。这个过程既考验开发者的编码...

    前后端分离的终端自适应动态表单设计1

    【标题】中的“前后端分离的终端自适应动态表单设计1”指的是在Web开发中采用前后端分离架构,以适应不同终端设备显示的动态表单设计方法。 【描述】中提到的"Ajax带来的SPA(单页面应用)"是指利用Ajax技术实现的...

    C#web项目前后端分离跨域解决[Demo].zip

    在IT行业中,前后端分离是一种常见的开发模式,它将用户界面与服务器端逻辑分离开来,使得前端开发者可以专注于用户体验和交互设计,而后端开发者则专注于数据处理和业务逻辑。在C# Web项目中,前后端分离同样适用,...

    laravel5.8 前后端分离 api注册登录请求

    在前后端分离的架构中,Laravel通常作为后端服务器,处理业务逻辑、数据存储和身份验证,而前端则使用如React或Vue.js这样的JavaScript库或框架来处理用户界面和交互。 要实现前后端分离的注册和登录API,我们需要...

    nodejs前后端分离

    在IT行业中,前后端分离是一种常见的开发模式,它旨在提高应用程序的可维护性和开发效率。Node.js,作为JavaScript运行环境,凭借其非阻塞I/O和事件驱动的特性,成为了实现前后端分离的重要工具。本篇文章将深入探讨...

    thinkphp+jwt实现前后端分离

    总的来说,这个项目为开发者提供了一个实践Thinkphp6和JWT结合的起点,有助于理解和掌握前后端分离的实现方法,同时也展示了现代Web开发中的一些最佳实践。通过学习和研究这个项目,开发者可以提升自己的技能,为...

    springboot基本的前后端项目理解

    下面将详细介绍这两个框架的基本概念、工作原理以及如何在前后端项目中使用它们。 ### SpringBoot基础知识 **1. 概述**:SpringBoot由Pivotal团队创建,旨在简化Spring应用的初始搭建以及开发过程。它通过提供“开...

    Rest风格前后端分离 web项目demo

    前后端分离的核心理念是让前端专注于用户交互和界面展示,而后端则专注于数据处理和业务逻辑。这样,前端可以通过API(通常为JSON格式)与后端进行通信,获取或更新数据。这种分离使得两者可以独立开发、测试和迭代...

    restful前后端分离api接口文档模板

    ### RESTful前后端分离API接口文档模板解析 #### 一、引言 在现代Web开发中,前后端分离已经成为一种趋势。在这种模式下,前端负责用户界面与用户体验,而后端则专注于业务逻辑处理与数据存储。为了实现这种分离,...

    基于SpringBoot + Vue开发的前后端分离的后台管理系统模板

    前后端分离是指前端负责展示层,后端负责数据处理和业务逻辑,两者通过API进行通信。这种方式的好处包括: 1. 提高开发效率:前后端可以并行开发,互不影响。 2. 易于维护:职责明确,前后端代码结构清晰。 3. 适应...

    前后端AES加解密信息交互示例(后端JAVA)

    在IT行业中,安全的数据传输是至关重要的,尤其是在前后端交互过程中。本示例"前后端AES加解密信息交互示例(后端JAVA)"提供了一个详细的教程,演示了如何利用AES加密技术来确保在前端与后端之间传递的数据安全无虞...

    jquery封装函数,前后端分离框架

    在前后端分离的框架中,jQuery扮演着重要的角色,因为它可以方便地处理客户端的数据交互和页面动态更新。 1. **jQuery封装函数**:为了提高代码复用性和可维护性,开发者通常会将常用的jQuery操作封装成自定义函数...

    前端及前后端联调工作流程.pptx

    ### 前端及前后端联调工作流程详解 #### 一、前端页面开发流程 前端页面是用户体验的第一接触点,其美观度和功能性直接影响着产品的整体评价。本章节将详细解析前端页面的设计与实现流程。 1. **新建页面** 在...

    基于SpringBoot+Vue的前后端分离仓储管理系统设计与实现

    5. **前后端分离**:前后端分离是现代Web开发的重要趋势,它将前端和后端职责明确分开,前端负责用户交互和界面展示,后端负责业务逻辑和数据处理。这种架构模式有利于团队协作,提高开发效率,同时有利于前端的独立...

Global site tag (gtag.js) - Google Analytics