使用 Axios 处理 AxiosError 的三种常见方法

种地  金牌会员 | 2024-6-21 13:10:47 | 显示全部楼层 | 阅读模式
打印 上一主题 下一主题

主题 849|帖子 849|积分 2547


在使用 Axios 时处理 AxiosError 有几种常见的方法:

  • 使用 try-catch 语句捕捉异常:
  1. try {
  2.   const response = await axios.get('/api/data');
  3.   // 处理响应数据
  4. } catch (error) {
  5.   if (error.response) {
  6.     // 请求成功但状态码不在 2xx 范围
  7.     console.log(error.response.data);
  8.     console.log(error.response.status);
  9.     console.log(error.response.headers);
  10.   } else if (error.request) {
  11.     // 请求发出但没有收到响应
  12.     console.log(error.request);
  13.   } else {
  14.     // 在设置请求时发生了错误
  15.     console.log('Error', error.message);
  16.   }
  17. }
复制代码

  • 使用 Axios 实例的 interceptors 拦截器:
  1. const instance = axios.create();
  2. instance.interceptors.response.use(
  3.   (response) => {
  4.     // 处理成功响应
  5.     return response;
  6.   },
  7.   (error) => {
  8.     // 处理错误响应
  9.     if (error.response) {
  10.       // 请求成功但状态码不在 2xx 范围
  11.       console.log(error.response.data);
  12.       console.log(error.response.status);
  13.       console.log(error.response.headers);
  14.     } else if (error.request) {
  15.       // 请求发出但没有收到响应
  16.       console.log(error.request);
  17.     } else {
  18.       // 在设置请求时发生了错误
  19.       console.log('Error', error.message);
  20.     }
  21.     return Promise.reject(error);
  22.   }
  23. );
复制代码

  • 使用 axios.isAxiosError() 判定错误是否来自 Axios:
  1. axios.get('/api/data')
  2.   .then((response) => {
  3.     // 处理响应数据
  4.   })
  5.   .catch((error) => {
  6.     if (axios.isAxiosError(error)) {
  7.       // 处理 AxiosError
  8.       if (error.response) {
  9.         // 请求成功但状态码不在 2xx 范围
  10.         console.log(error.response.data);
  11.         console.log(error.response.status);
  12.         console.log(error.response.headers);
  13.       } else if (error.request) {
  14.         // 请求发出但没有收到响应
  15.         console.log(error.request);
  16.       } else {
  17.         // 在设置请求时发生了错误
  18.         console.log('Error', error.message);
  19.       }
  20.     } else {
  21.       // 处理其他类型的错误
  22.       console.log('Error', error);
  23.     }
  24.   });
复制代码
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

种地

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表