Axios请求返回401时无法获取后端自定义错误信息该如何解决？

• 后端路由存在隐性逻辑缺陷：if(req.user)分支执行res.json()后没有加return终止函数执行，无论用户是否通过认证，后续的401响应代码都会尝试执行，属于会引发异常的隐性bug。
• Axios错误对象封装规则：你自定义的后端响应内容不会直接挂载在error根对象上，直接打印error只会输出Axios默认的通用错误提示，业务自定义内容存放在error.response属性下。

1. 修复后端路由代码 #

在返回用户信息的分支加return，避免重复发送响应：

router.get("/get-authenticated-user", (req, res) => {
  if (req.user) {
    return res.json({ user: req.user });
  }
  res.status(401).json({ err: "Not authenticated" });
});

2. 调整前端错误捕获逻辑 #

从error.response.data中读取后端返回的自定义错误信息：

<script>
  axios
    .get("http://localhost:5000/get-authenticated-user")
    .then(function (response) {
      // 处理成功响应
      console.log(response);
    })
    .catch(function (error) {
      // 存在响应的情况（后端返回了状态码）
      if (error.response) {
        // 输出自定义错误信息
        console.log(error.response.data.err);
        // 可按需获取状态码、响应头信息
        console.log(error.response.status, error.response.headers);
      } else {
        // 网络异常、请求未发出等无响应的情况
        console.log(error.message);
      }
    });
</script>

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