axios什么时候走error

原创

mob64ca12f062df 2024-05-03 08:03:00 ©著作权

文章标签 ios 拦截器错误处理 文章分类 iOS 移动开发

©著作权归作者所有：来自51CTO博客作者mob64ca12f062df的原创作品，请联系作者获取转载授权，否则将追究法律责任

如何实现axios什么时候走error

1. 概述

在使用axios发送网络请求时，有时候会出现错误，比如网络不通、服务器异常等。我们可以通过设置axios实例的拦截器来处理这些错误，并在特定情况下执行相应操作。本文将介绍如何实现当axios请求出错时走error处理流程。

2. 流程概述

为了更好地理解整个流程，我们可以通过以下表格展示每个步骤的具体内容：

步骤	操作
步骤一	创建axios实例
步骤二	设置拦截器
步骤三	处理错误逻辑

3. 具体操作步骤

步骤一：创建axios实例

首先，我们需要创建一个axios实例，用于发送网络请求。可以使用以下代码创建实例：

// 创建axios实例
const axiosInstance = axios.create({
  baseURL: ' // 设置基础url
  timeout: 5000 // 设置超时时间
});

步骤二：设置拦截器

接下来，我们需要设置axios实例的拦截器，以便在请求或响应被then或catch处理前拦截它们。可以使用以下代码设置拦截器：

// 请求拦截器
axiosInstance.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么
    return config;
  },
  error => {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
);

// 响应拦截器
axiosInstance.interceptors.response.use(
  response => {
    // 对响应数据做些什么
    return response.data;
  },
  error => {
    // 对响应错误做些什么
    return Promise.reject(error);
  }
);

步骤三：处理错误逻辑

最后，我们可以在拦截器中处理错误逻辑，当请求出错时执行相应操作。可以使用以下代码处理错误逻辑：

// 错误处理逻辑
axiosInstance.interceptors.response.use(
  response => {
    // 对响应数据做些什么
    return response.data;
  },
  error => {
    // 对响应错误做些什么
    if (error.response) {
      // 请求已发出，但服务器响应状态码不在 2xx 范围内
      console.log(error.response.data);
      console.log(error.response.status);
      console.log(error.response.headers);
    } else {
      // 请求超时或网络错误
      console.log('Error', error.message);
    }
    return Promise.reject(error);
  }
);