Ajax请求触发error回调时如何获取后端返回的JSON数据？

• jQuery的$.ajax回调函数的参数结构在success和error中完全不同：
  • success回调的第一个参数是后端返回的、已经自动解析完成的响应体数据，所以可以直接读取data字段
  • error回调的第一个参数是jqXHR（jQuery封装的XMLHttpRequest对象），并非直接返回的响应体，后端返回的JSON数据默认存储在jqXHR.responseJSON属性中，直接访问第一个参数的data属性自然返回undefined
• 特殊场景补充：如果jQuery没有自动将响应解析为JSON，数据还会以字符串形式存储在jqXHR.responseText属性中，需要手动转成JSON对象再读取字段。

调整AJAX请求中error回调的取值逻辑即可，修改后的代码如下：

$("#start_calculation_button").click(function () {
    $.ajax({
        url: "/",
        type: 'get',
        data: {
            // 业务参数保持不变
        },
        // 新增该配置强制所有响应统一解析为JSON，减少兼容处理
        dataType: 'json',
        success: function (response) {
            console.log(response.data);
        },
        error: function (jqXHR) {
            // 兼容自动解析和未自动解析两种场景
            const res = jqXHR.responseJSON || JSON.parse(jqXHR.responseText);
            console.log(res.data);
        }
    })
})

内容的提问来源于stack exchange，提问作者Samuel