Next.js中可以配置全局axios拦截器吗？

核心结论 #

axios拦截器完全支持在Node.js（含NestJS）服务端环境运行，你遇到的不生效问题均为配置使用错误导致。

常见不生效原因 #

• 拦截器绑定实例与实际发请求的实例不匹配：如果你在项目中使用axios.create()创建了自定义实例发送请求，仅给全局axios默认实例绑定拦截器不会生效，需要给你实际使用的自定义实例单独绑定拦截器。
• 拦截器注册时机晚于请求发起：拦截器必须在对应的实例发送请求之前完成注册，NestJS场景下建议将带拦截器的axios实例封装为全局Provider，在应用启动阶段完成初始化后再供业务模块注入使用。
• 拦截器逻辑缺失返回值：请求拦截器中必须显式return config，响应拦截器的成功分支需return response，异常分支需抛出错误或return Promise.reject(error)，缺失返回值会导致请求链路中断，看起来和拦截器未生效表现一致。

NestJS服务端正确配置示例 #

// 自定义带拦截器的axios provider
import axios from 'axios';
import { Provider } from '@nestjs/common';

export const AXIOS_INSTANCE = 'AXIOS_INSTANCE';
export const AxiosProvider: Provider = {
  provide: AXIOS_INSTANCE,
  useFactory: () => {
    const httpInstance = axios.create({
      baseURL: process.env.TARGET_API_BASE,
      timeout: 10000
    });

    // 请求拦截器：记录请求参数
    httpInstance.interceptors.request.use(config => {
      console.log('请求信息：', config.method, config.url, config.params, config.data);
      return config;
    }, error => {
      console.log('请求发起异常：', error.message);
      return Promise.reject(error);
    });

    // 响应拦截器：记录响应参数
    httpInstance.interceptors.response.use(response => {
      console.log('响应信息：', response.config.url, response.status, response.data);
      return response;
    }, error => {
      console.log('响应异常：', error.config.url, error.response?.status, error.message);
      return Promise.reject(error);
    });

    return httpInstance;
  }
};

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