Ant Design Pro V5 给接口统一添加token

3,594 阅读1分钟

在app.tsx的文件末添加拦截器,拦截器可以写多个

const authHeaderInterceptor: RequestInterceptor = ( url: string, options:  RequestOptionsInit ) => {
  const obj: any = options;
  if(localStorage.getItem('token')) {
    const token = localStorage.getItem('token');
    obj.headers = {
      ...obj.headers,
      "Authorization": token||'',
      'Content-Type': 'application/json'
    }
  }
  return { url, obj };
}

/**
 * 异常处理
 */
const errorHandler = ( error: ResponseError ) => {
  const { response } = error;

  if(!response) {
    notification.error({
      description: '您的网络发生异常,无法连接服务器',
      message: '网络异常'
    })
  }
  throw error;
};

export const request: RequestConfig = {
  errorHandler,
  credentials: 'include',
  requestInterceptors: [
    authHeaderInterceptor
  ]
  
}