Axios 在typescript中的统一封装

import axios, {
  AxiosInstance,
  AxiosRequestConfig,
  AxiosResponse,
  AxiosError,
} from "axios";
import qs from "qs";

// 后端返回的数据类型
type ResponseData<T> = {
  code: number;
  data: T;
  message: string;
};
// 创建axios实例
const axiosInstance: AxiosInstance = axios.create({
  timeout: 60000,
});

// 异常拦截处理器
const errorHandler = (error: AxiosError) => {
  if (error.response) {
    switch (error.response.status) {
      case 401:
        // 登录过期错误处理
        break;
      case 500:
        // 服务器错误处理
        break;
      default:
    }
  }
  return Promise.reject(error);
};
// 请求拦截处理器
axiosInstance.interceptors.request.use((config: AxiosRequestConfig) => {
  // qs是axios自带的序列化参数方式
  if (
    config.headers &&
    config.headers["Content-Type"] &&
    (config.headers["Content-Type"] as string).includes(
      "application/x-www-form-urlencoded"
    )
  ) {
    config.params = qs.stringify(config.params);
  }
  return config;
}, errorHandler);
// 响应拦截处理器
axiosInstance.interceptors.response.use((response: AxiosResponse) => {
  return response.data;
}, errorHandler);

export function request<T>(config: AxiosRequestConfig<T>): Promise<T> {
  return new Promise((resolve, reject) => {
    axiosInstance
      .request<T, AxiosResponse<ResponseData<T>>>(config)
      .then((result: AxiosResponse<ResponseData<T>>) => {
        const { data } = result;
        if (data.code === 0) {
          resolve(data.data);
        } else {
          reject(data);
        }
      })
      .catch((err: AxiosError) => {
        reject(err);
      });
  });
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值