如何在Axios捕获404错误后于finally中使用错误响应

这个问题的核心在于：Axios遇到4xx/5xx这类HTTP错误状态码时会抛出异常，但这个异常对象里其实包含了服务器返回的完整响应信息，只是你目前没有把这个错误对象保存下来，导致finally块里拿不到它。

你可以通过新增一个变量来存储错误对象，这样在finally块里就能同时访问正常响应和错误响应了，具体修改如下：

(async() => { 
  let apiRes = null;
  let apiErr = null; // 新增变量存储错误对象
  try { 
    apiRes = await axios.get('https://silex.edgeprop.my/api/v1/a'); 
  } catch (err) { 
    apiErr = err; // 把错误对象存起来
    console.error('请求出错:', err.message);
  } finally { 
    if (apiRes) {
      console.log('正常响应:', apiRes);
    } else if (apiErr) {
      // 错误响应存在于apiErr.response中
      console.log('错误响应:', apiErr.response);
      // 你可以从中提取状态码、响应数据等
      console.log('错误状态码:', apiErr.response.status);
      console.log('错误响应数据:', apiErr.response.data);
    }
  } 
})();

补充说明Axios错误对象的结构： #

• 当服务器成功返回响应（哪怕是404这类错误状态）：err.response会包含完整的响应对象，包括status（状态码）、data（响应体）、headers等。
• 如果请求发出去但完全没收到响应（比如网络断了）：err.request会记录请求相关信息，此时err.response为undefined。
• err.message是错误的描述信息，方便快速排查问题。

这样修改后，不管请求是成功还是失败（包括404这类有响应的错误），你都能在finally块里获取到对应的响应信息啦。

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