ims-front/src/plugins/axios.ts
2024-12-01 19:02:48 +08:00

72 lines
1.8 KiB
TypeScript

import { http } from '@/settings/http'
import { useUserStore } from '@/stores/user'
import axios, { InternalAxiosRequestConfig, type AxiosError, type AxiosResponse } from 'axios'
import type { App } from 'vue'
import router from '@/router'
export interface GlobalError {
/** 错误码 */
code: number
/** 错误信息 */
message: string
}
// 获取 HTTP 请求头
export const getHTTPHeaders = (): Record<string, string> => {
const newHeaders: Record<string, string> = {}
const token = useUserStore().token
if (token) {
newHeaders.Authorization = token
}
return newHeaders
}
export function defaultSuccess(data: unknown): void {
console.log(data)
}
export function defaultError(error: { code: string; error?: string }): void {
if (error) {
router.push({ path: '/message', query: { status: error.code, message: error.error } })
}
}
const config = {
baseURL: http.prefix,
timeout: http.timeout,
}
const _axios = axios.create(config)
_axios.interceptors.request.use(
(cfg: InternalAxiosRequestConfig) => {
cfg.headers = Object.assign(cfg.headers || {}, getHTTPHeaders())
return cfg
},
(err: unknown) => {
console.warn(err)
return Promise.reject(new Error('客户端配置错误!'))
},
)
_axios.interceptors.response.use(
(response: AxiosResponse) => {
// 数据成功
return Promise.resolve(response)
},
(error: AxiosError<GlobalError>) => {
switch (Number(error.response?.status)) {
case 403 | 401:
return Promise.reject({ code: Number(error.response?.status) })
case 404: {
return Promise.reject({ code: '404' })
}
case 500:
default:
return Promise.reject({ code: '500', error: error.response?.data.message })
}
},
)
export { _axios as http }
export default {
install: (app: App) => {
app.config.globalProperties.$http = _axios
},
}