TS二次封装Axios-526互联

// 使用TS二次封装axios，添加拦截器和类型约束
import axios, { AxiosRequestConfig, Method, HttpStatusCode } from 'axios'

// 创建axios实例对象并进行基础配置
const service = axios.create({
  baseURL: '/api',
  timeout: 5000
})

// 设置请求拦截器，一般用来设置请求头，如token等
service.interceptors.request.use(
  config => {
    // 添加请求头等操作
    return config
  },
  error => Promise.reject(error)
)

// 设置响应拦截器，一般用来处理后台返回的数据
service.interceptors.response.use(
  response => response.data,
  error => Promise.reject(error)
)

// 定义返回数据的类型
type Result<T> = {
  code: HttpStatusCode
  msg?: string
  data?: T
}

// 为了添加参数的类型约束，给service再包裹一层函数
const request = <T = any>(
  url: string,
  method: Method,
  submitData?: Object,
  config?: AxiosRequestConfig
) =>
  service<T, Result<T>>({
    url,
    method,
    // get请求用params接收，其他请求用data
    [method.toLowerCase() === 'get' ? 'params' : 'data']: submitData,
    ...config
  })

export default request