From 263dd5edfc48398fe319e9f08b526ecc75f197e7 Mon Sep 17 00:00:00 2001 From: yangsy Date: Mon, 5 Jan 2026 11:30:20 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=B0=86=E8=AF=B7=E6=B1=82?= =?UTF-8?q?=E5=B0=81=E8=A3=85=E9=87=8D=E6=9E=84=E4=B8=BA=E5=87=BD=E6=95=B0?= =?UTF-8?q?=E6=A8=A1=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/client/ndm-client.ts | 6 +- src/apis/client/user-client.ts | 4 +- .../{request-client.ts => http-client.ts} | 95 +++++++++---------- src/utils/index.ts | 2 +- 4 files changed, 52 insertions(+), 55 deletions(-) rename src/utils/{request-client.ts => http-client.ts} (64%) diff --git a/src/apis/client/ndm-client.ts b/src/apis/client/ndm-client.ts index 9d1d4ed..d68f5ac 100644 --- a/src/apis/client/ndm-client.ts +++ b/src/apis/client/ndm-client.ts @@ -1,8 +1,8 @@ import { useUserStore } from '@/stores'; -import { getAppEnvConfig, RequestClient } from '@/utils'; +import { createHttpClient, getAppEnvConfig } from '@/utils'; import type { AxiosError } from 'axios'; -export const ndmClient = new RequestClient({ +export const ndmClient = createHttpClient({ requestInterceptor: async (config) => { const userStore = useUserStore(); const { lampAuthorization, lampClientId, lampClientSecret } = getAppEnvConfig(); @@ -25,7 +25,7 @@ export const ndmClient = new RequestClient({ const userStore = useUserStore(); await userStore.lampLogin(stationCode); error.config.headers.token = userStore.lampLoginResultRecord?.[stationCode]?.token ?? ''; - return ndmClient.requestInstance(error.config); + return ndmClient.clientInstance(error.config); } return Promise.reject(error); }, diff --git a/src/apis/client/user-client.ts b/src/apis/client/user-client.ts index 014b719..f096d86 100644 --- a/src/apis/client/user-client.ts +++ b/src/apis/client/user-client.ts @@ -1,9 +1,9 @@ import router from '@/router'; import { useUserStore } from '@/stores'; -import { getAppEnvConfig, RequestClient } from '@/utils'; +import { createHttpClient, getAppEnvConfig } from '@/utils'; import type { AxiosError } from 'axios'; -export const userClient = new RequestClient({ +export const userClient = createHttpClient({ requestInterceptor: (config) => { const userStore = useUserStore(); const { lampAuthorization, lampClientId, lampClientSecret } = getAppEnvConfig(); diff --git a/src/utils/request-client.ts b/src/utils/http-client.ts similarity index 64% rename from src/utils/request-client.ts rename to src/utils/http-client.ts index b8f197a..dfc344b 100644 --- a/src/utils/request-client.ts +++ b/src/utils/http-client.ts @@ -1,54 +1,41 @@ import type { Result } from '@/types'; -import axios, { isAxiosError, type AxiosError, type AxiosInstance, type AxiosRequestConfig, type AxiosResponse, type CreateAxiosDefaults, type InternalAxiosRequestConfig } from 'axios'; +import axios, { isAxiosError, type AxiosError, type AxiosRequestConfig, type AxiosResponse, type CreateAxiosDefaults, type InternalAxiosRequestConfig } from 'axios'; -export type Response = [err: AxiosError | null, data: T | null, resp: Result | null]; +export type HttpResponse = [err: AxiosError | null, data: T | null, resp: Result | null]; -export interface RequestOptions extends CreateAxiosDefaults { +export interface HttpRequestOptions extends CreateAxiosDefaults { requestInterceptor?: (config: InternalAxiosRequestConfig) => InternalAxiosRequestConfig | Promise; responseInterceptor?: (resp: AxiosResponse) => AxiosResponse | Promise; responseErrorInterceptor?: (error: any) => any; } -export class RequestClient { - private instance: AxiosInstance; - - constructor(config?: RequestOptions) { - this.instance = axios.create(config); - - const requestInterceptor = config?.requestInterceptor ?? RequestClient.defaultRequestInterceptor; - const responseInterceptor = config?.responseInterceptor ?? RequestClient.defaultResponseInterceptor; - const responseErrorInterceptor = config?.responseErrorInterceptor ?? RequestClient.defaultResponseErrorInterceptor; - - this.instance.interceptors.request.use(requestInterceptor); - - this.instance.interceptors.response.use(responseInterceptor, responseErrorInterceptor); - } - - private static defaultRequestInterceptor(config: InternalAxiosRequestConfig) { - return config; - } - - private static defaultResponseInterceptor(response: AxiosResponse) { - return response; - } - - private static defaultResponseErrorInterceptor(error: any) { - const err = error as AxiosError; - if (err.status === 401) { - } - if (err.status === 404) { +export const createHttpClient = (config?: HttpRequestOptions) => { + const defaultRequestInterceptor = (config: InternalAxiosRequestConfig) => config; + const defaultResponseInterceptor = (response: AxiosResponse) => response; + const defaultResponseErrorInterceptor = (error: any) => { + if (isAxiosError(error)) { + if (error.status === 401) { + // 处理 401 错误 + } + if (error.status === 404) { + // 处理 404 错误 + } } return Promise.reject(error); - } + }; - public get requestInstance(): AxiosInstance { - return this.instance; - } + const requestInterceptor = config?.requestInterceptor ?? defaultRequestInterceptor; + const responseInterceptor = config?.responseInterceptor ?? defaultResponseInterceptor; + const responseErrorInterceptor = config?.responseErrorInterceptor ?? defaultResponseErrorInterceptor; - get(url: string, options?: AxiosRequestConfig & { retRaw?: boolean }): Promise> { + const instance = axios.create(config); + instance.interceptors.request.use(requestInterceptor); + instance.interceptors.response.use(responseInterceptor, responseErrorInterceptor); + + const httpGet = (url: string, options?: AxiosRequestConfig & { retRaw?: boolean }): Promise> => { const { retRaw, ...reqConfig } = options ?? {}; return new Promise((resolve) => { - this.instance + instance .get(url, { ...reqConfig, }) @@ -64,12 +51,12 @@ export class RequestClient { resolve([err as AxiosError, null, null]); }); }); - } + }; - post(url: string, data?: AxiosRequestConfig['data'], options?: Partial> & { retRaw?: boolean; upload?: boolean }): Promise> { + const httpPost = (url: string, data?: AxiosRequestConfig['data'], options?: Partial> & { retRaw?: boolean; upload?: boolean }): Promise> => { const { retRaw, upload, ...reqConfig } = options ?? {}; return new Promise((resolve) => { - this.instance + instance .post(url, data, { headers: { 'content-type': upload ? 'multipart/form-data' : 'application/json' }, ...reqConfig }) .then((res) => { const resData = res.data; @@ -83,12 +70,12 @@ export class RequestClient { resolve([err as AxiosError, null, null]); }); }); - } + }; - put(url: string, data?: AxiosRequestConfig['data'], options?: Partial>): Promise> { + const httpPut = (url: string, data?: AxiosRequestConfig['data'], options?: Partial>): Promise> => { const reqConfig = options ?? {}; return new Promise((resolve) => { - this.instance + instance .put>(url, data, { ...reqConfig }) .then((res) => { resolve([null, res.data.data, res.data]); @@ -97,12 +84,12 @@ export class RequestClient { resolve([err as AxiosError, null, null]); }); }); - } + }; - delete(url: string, idList: string[], options?: Partial>): Promise> { + const httpDelete = (url: string, idList: string[], options?: Partial>): Promise> => { const reqConfig = options ?? {}; return new Promise((resolve) => { - this.instance + instance .delete>(url, { ...reqConfig, data: idList }) .then((res) => { resolve([null, res.data.data, res.data]); @@ -111,11 +98,21 @@ export class RequestClient { resolve([err as AxiosError, null, null]); }); }); - } -} + }; + + return { + get clientInstance() { + return instance; + }, + get: httpGet, + post: httpPost, + put: httpPut, + delete: httpDelete, + }; +}; // 从响应中解析出数据 -export const unwrapResponse = (resp: Response) => { +export const unwrapResponse = (resp: HttpResponse) => { const [err, data, result] = resp; // 如果 err 存在说明有 http 错误，那么直接抛出错误， diff --git a/src/utils/index.ts b/src/utils/index.ts index e0471d4..8446a80 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -4,5 +4,5 @@ export * from './download'; export * from './env'; export * from './format-duration'; export * from './random-num'; -export * from './request-client'; +export * from './http-client'; export * from './sleep';