Axios请求拦截器request回调函数不生效问题咨询

问题根因 #

你给全局axios对象挂载了拦截器，但最终导出使用的是axios.create()生成的全新独立实例，axios的不同实例之间配置和拦截器完全隔离，新实例没有挂载你编写的拦截器，因此回调不会触发。

修复方案 #

调整代码顺序，先创建实例，再给这个实例挂载拦截器后再导出即可：

import {setupInterceptorsTo} from "./Interceptors";
import axios from "axios";

// 先创建自定义实例
const axiosInstance = axios.create({
  baseURL :"https://api.test.com"
});
// 给当前自定义实例挂载拦截器
setupInterceptorsTo(axiosInstance);

export default axiosInstance;

如果需要全局使用拦截器，也可以直接导出挂载了拦截器的全局axios对象，无需创建新实例：

import {setupInterceptorsTo} from "./Interceptors";
import axios from "axios";

setupInterceptorsTo(axios);
export default axios;

理解正误说明 #

• 你对onRequest的理解正确：它会在所属实例的所有请求正式发起前触发，可统一修改请求配置。
• 你对onRequestError的理解存在偏差：onRequestError仅在请求拦截器内部执行出错、返回拒绝状态Promise时触发；404、500等服务端返回的状态码错误属于响应阶段异常，只会触发onResponseError回调。

内容的提问来源于stack exchange，提问作者Md. Parvez Alam