Axios Interceptors（拦截器）

Interceptors（拦截器）

你可以在then 或catch处理请求或响应之前拦截它们。

// 添加请求拦截器
axios.interceptors.request.use(function (config) {		// 在发送请求之前做一些事情
    return config;
  }, function (error) {									//处理请求错误
    return Promise.reject(error);		
  });

// 添加响应拦截器
axios.interceptors.response.use(function (response) {	//在2xx范围内的任何状态代码都会触发此函数，处理响应数据
    return response;
  }, function (error) {  			//任何超出2xx范围的状态码都会触发该函数。对响应错误做些什么
    return Promise.reject(error);
  });

如果以后需要删除拦截器，可以这样做。

const myInterceptor = axios.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);	// eject: 开除，弹出

你还可以清除请求或响应的所有拦截器。

const instance = axios.create();
instance.interceptors.request.use(function () {/*...*/});
instance.interceptors.request.clear();  // 从请求中移除全部拦截器
instance.interceptors.response.use(function () {/*...*/});
instance.interceptors.response.clear(); // 从响应中移除全部拦截器

你可以向AXIOS的自定义实例添加拦截器。

const instance = axios.create();
instance.interceptors.request.use(function () {/*...*/});

当您添加请求拦截器时，默认情况下它们被假定为异步的。当主线程被阻塞时，这可能会导致AXIOS请求的执行延迟( 在幕后为拦截器创建承诺，并将您的请求放在调用堆栈的底部 )。如果您的请求拦截器是同步的，您可以向Options对象添加一个标志，告诉AXIos同步运行代码并避免请求执行中的任何延迟。

axios.interceptors.request.use(function (config) {
  config.headers.test = 'I am only a header!';
  return config;
}, null, { synchronous: true });

如果你想基于运行时检查执行一个特定的拦截器，你可以在options对象中添加一个runWhen函数。当且仅当runWhen 的返回值为false时，拦截器将不会被执行。该函数将与config对象一起调用(不要忘记，您也可以将自己的参数绑定到它)。当您有一个只需要在特定时间运行的异步请求拦截器时，这是非常方便的。

function onGetCall(config) {
  return config.method === 'get';
}
axios.interceptors.request.use(function (config) {
  config.headers.test = 'special get headers';
  return config;
}, null, { runWhen: onGetCall });

Multiple Interceptors

假设您添加了多个响应拦截器以及响应完成的时间。

• 然后执行每个拦截器。
• 然后按照添加的顺序执行它们。
• 然后只返回最后一个拦截器的结果。
• 然后每个拦截器接收其前一个拦截器的结果。
• 当履行拦截器抛出。
  • 则不调用以下实现-拦截器。
  • 然后调用以下拒绝拦截器。
  • 一旦被捕获，将再次调用另一个跟随履行的拦截器(就像在承诺链中一样)。

阅读拦截器tests，查看代码中的所有这些内容。