axios实例无法同时触发请求和响应拦截器是什么原因？

• 首先确认请求拦截器返回配置后，请求是否实际发出：如果getDefaultHeaders()返回了非法请求头（比如键名含特殊字符、值为未序列化的对象/undefined），或者GATEWAY_URL配置错误导致请求地址不合法，浏览器会直接终止请求发送，自然不会触发响应拦截器。
• 检查是否存在请求取消逻辑：如果代码中使用cancelToken或AbortController在请求发出后立刻取消了请求，未触发响应流程的情况下也只会打印请求拦截器的日志。
• 排查全局axios拦截器的影响：如果给axios全局对象注册过拦截器，全局请求拦截器可能中断了Promise链，导致实例请求发不出去。
• 确认跨域预检是否通过：如果是跨域请求，OPTIONS预检请求返回非2xx状态码时，浏览器会阻断正式请求发送，不会进入响应流程。

验证方法 #

你可以替换实例配置为公共测试接口，验证拦截器本身逻辑是否正常：

const testInstance = axios.create({
    baseURL: 'https://jsonplaceholder.typicode.com',
});

testInstance.interceptors.request.use(
    function (config) {
        console.log('before');
        return config;
    },
    function (error) {
        return Promise.reject(error);
    },
);

testInstance.interceptors.response.use(function (response) {
    console.log('after')
    return response;
  }, function (error) {
    return Promise.reject(error);
  });

// 发起测试请求
testInstance.get('/todos/1')

如果测试代码可以同时打印before和after，说明你的原代码问题出在baseURL配置、默认请求头配置上，和拦截器注册逻辑无关。

内容的提问来源于stack exchange，提问作者user10045300