TypeScript 项目中接口的统一管理

import axios from 'axios'

let request = axios.create({
    baseURL: import.meta.env.VITE_APP_BASE_API,
    timeout: 5000
})

request.interceptors.request.use((config) => {
    // config配置对象中的一个重要属性 headers 请求头, 通常用来给服务其携带公共参数
    return config
})

request.interceptors.response.use((response) => {
    return response.data // 简化请求回来的数据
}, (error) => {
    // 失败回调：处理 http 网络错误
    let message = ''
    let status = error.response.status
    switch (status) {
        case 401:
            message="身份验证过期，请重新登录"
            break
        case 403:
            message="你无权访问"
            break
        case 404:
            message="资源没有找到"
            break
        case 500:
            message="服务器出现故障"
    }

    return Promise.reject(error) // 终结 Promise 链
})

export default request

// req-登录接口
// 携带参数的数据类型
export interface loginForm {
    username: string,
    password: string
}
// 返回的数据的数据类型
interface dataType {
    token: string
}
export interface loginResponseData {
    code: number,
    data: dataType
}

// req-用户信息获取接口
// 返回的数据的数据类型
interface userInfo {
    userId: number,
    avatar: string,
    username: string,
    password: string,
    desc: string,
    roles: string[],
    buttons: string[],
    routes: string[],
    token: string
}
interface user {
    checkUser: userInfo
}
export interface userResponseData {
    code: number,
    data: user
}

import request from '@/utils/request/index.ts'
import type { loginForm, loginResponseData, userResponseData } from "@/api/user/type.ts";

// 枚举请求接口地址
enum API {
    LOGIN_URL= '/user/login',
    USERINFO_URL = '/user/info'
}

export const reqLogin = (data: loginForm) =>  request.post<any, loginResponseData>(API.LOGIN_URL, data) // req-登录接口

export const reqUserInfo = () => request.get<any,userResponseData>(API.USERINFO_URL) // req-获取用户信息接口