axios拦截器抛出异常

在前端开发中，我们经常会使用axios库来发送HTTP请求。axios是一个基于Promise的HTTP客户端，可以在浏览器和Node.js中使用。它提供了简洁的API来处理HTTP请求和响应，使我们能够更方便地进行数据交互。

axios的一个重要特性是拦截器（interceptors）。拦截器允许我们在发送请求或响应之前对其进行一些处理。我们可以使用拦截器来添加认证信息、修改请求头、处理错误等。

本文将详细介绍axios拦截器的使用，并重点介绍如何通过拦截器抛出异常。

什么是拦截器？

拦截器是axios提供的一种机制，用于在请求或响应被发送之前对其进行拦截和处理。我们可以在请求或响应被发送之前、之后或发生错误时执行一些操作。

axios提供了两种类型的拦截器：请求拦截器和响应拦截器。请求拦截器在发送请求之前执行，响应拦截器在接收到响应之后执行。

拦截器使用use方法进行注册，它接收两个参数：第一个参数是拦截器的处理函数，第二个参数是可选的错误处理函数。拦截器的处理函数会接收一个请求配置对象或一个响应对象，并返回一个请求配置对象或一个响应对象。

下面是一个使用拦截器的示例：

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

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

拦截器的执行顺序

拦截器的执行顺序是按照注册的顺序执行的。即先注册的拦截器会先执行，后注册的拦截器会后执行。

对于请求拦截器，它们的执行顺序是按照注册的顺序从上到下执行的。对于响应拦截器，它们的执行顺序是按照注册的顺序从下到上执行的。

通过拦截器抛出异常

在实际开发中，我们可能需要在拦截器中对错误进行处理，例如在请求失败时抛出一个异常。这样可以方便地统一处理请求的错误，而不需要在每个请求处单独处理错误。

我们可以通过在拦截器的错误处理函数中使用Promise.reject(error)来抛出异常。这样，后续的拦截器和调用者就可以通过catch语句来捕获异常。

下面是一个示例，演示了如何在拦截器中抛出异常：

axios.interceptors.response.use(
  response => {
    // 对响应数据做些什么
    return response;
  },
  error => {
    // 对响应错误做些什么
    return Promise.reject(error); // 抛出异常
  }
);

// 调用API
axios.get('/api/data')
  .then(response => {
    // 处理成功响应
  })
  .catch(error => {
    // 捕获异常
    console.error(error);
  });

在上面的示例中，如果请求失败，拦截器中的错误处理函数会将错误对象error通过Promise.reject(error)抛出。然后，在调用axios.get('/api/data')的.catch语句中可以捕获到这个异常，并进行相应的处理。

序列图

下面是一个使用axios发送HTTP请求的序列图，展示了拦截器的执行流程：

sequenceDiagram
  participant Client