如何处理调用Azure Blob存储API返回403却未被catch捕获的问题

核心问题定位 #

1. 冗余的Promise封装导致异常链路异常
   你定义的getReq是async异步函数，同时手动封装了一层Promise，属于不必要的冗余逻辑，axios.get本身已经返回Promise实例，多余的封装可能导致异常抛出链路出错，无法正常被捕获。
2. 异步方法调用未加await
   你截图中出现的Unhandled Promise Rejection错误，绝大多数场景是调用getReq时没有搭配await关键字，异步方法返回的Promise抛出reject时没有对应捕获逻辑，自然不会进入你写的catch块。
3. axios的validateStatus配置异常
   axios默认会将2xx、3xx状态码判定为成功请求进入then逻辑，4xx、5xx进入catch逻辑。如果你自定义过全局/请求级的validateStatus配置，把403判定为成功状态，就会导致403响应走then逻辑，不会触发catch。

修正代码 #

优化请求方法 #

getReq = async url => {
  try {
    const response = await axios.get(url)
    return response.data
  } catch (error) {
    // 统一分类处理错误
    if (error.response) {
      // 接口有返回响应，403、404这类状态码都会进入该分支
      const status = error.response.status
      // 可根据业务需求自定义不同状态码的错误提示
      if (status === 403) {
        throw new Error('无文件访问权限，请确认存储签名是否正确')
      } else if (status === 404) {
        throw new Error('访问的文件不存在')
      }
      throw new Error(`请求失败，状态码：${status}`)
    } else if (error.request) {
      throw new Error('网络异常，未收到服务端响应')
    } else {
      throw new Error(`请求配置错误：${error.message}`)
    }
  }
};

正确的调用方式 #

调用异步方法时必须搭配await，外层用try/catch包裹即可捕获所有错误：

// 业务侧调用示例
const loadBlobFile = async () => {
  try {
    const fileData = await getReq('替换为你的Blob文件访问地址')
    // 成功后的数据处理逻辑
  } catch (err) {
    // 此处可捕获到所有请求错误，包括403
    console.log('错误信息：', err.message)
    // 自定义业务错误处理，比如弹窗提示用户
  }
}

额外说明 #

Azure Blob返回的403响应是XML格式，你可以在catch分支中引入XML转JSON的工具类，解析出Message、AuthenticationErrorDetail等节点的内容，给用户更精准的错误提示。

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