feat(projects): @sa/axios: createRequest, createFlatRequest, createHookRequest

src/service/api/auth.ts

@@ -7,9 +7,10 @@ import { request } from '../request';
  * @param password Password
  */
 export function fetchLogin(userName: string, password: string) {
-  return request<App.Service.Response<Api.Auth.LoginToken>>('/auth/login', {
+  return request<Api.Auth.LoginToken>({
+    url: '/auth/login',
     method: 'post',
-    body: {
+    data: {
       userName,
       password
     }
@@ -18,7 +19,7 @@ export function fetchLogin(userName: string, password: string) {
 
 /** Get user info */
 export function fetchGetUserInfo() {
-  return request<App.Service.Response<Api.Auth.UserInfo>>('/auth/getUserInfo');
+  return request<Api.Auth.UserInfo>({ url: '/auth/getUserInfo' });
 }
 
 /**
@@ -27,10 +28,22 @@ export function fetchGetUserInfo() {
  * @param refreshToken Refresh token
  */
 export function fetchRefreshToken(refreshToken: string) {
-  return request<App.Service.Response<Api.Auth.LoginToken>>('/auth/refreshToken', {
+  return request<Api.Auth.LoginToken>({
+    url: '/auth/refreshToken',
     method: 'post',
-    body: {
+    data: {
       refreshToken
     }
   });
 }
+
+export function fetchDebug() {
+  return request<string>({
+    url: '/debug-post',
+    method: 'post',
+    headers: { 'content-type': 'application/x-www-form-urlencoded' },
+    data: {
+      a: '1'
+    }
+  });
+}

src/service/api/route.ts

@@ -6,7 +6,7 @@ import { request } from '../request';
  * @param example Whether to use example data, default: 0
  */
 export function fetchGetUserRoutes(example: '0' | '1' = '0') {
-  return request<App.Service.Response<Api.Route.UserRoute>>('/route/getUserRoutes', { params: { example } });
+  return request<Api.Route.UserRoute>({ url: '/route/getUserRoutes', params: { example } });
 }
 
 /**
@@ -16,5 +16,5 @@ export function fetchGetUserRoutes(example: '0' | '1' = '0') {
  * @param example Whether to use example data, default: 0
  */
 export function fetchIsRouteExist(routeName: string, example: '0' | '1' = '0') {
-  return request<App.Service.Response<boolean>>('/route/isRouteExist', { params: { routeName, example } });
+  return request<boolean>({ url: '/route/isRouteExist', params: { routeName, example } });
 }

src/service/request/index.ts

@@ -1,4 +1,4 @@
-import { createOfetch as createRequest } from '@sa/request';
+import { BACKEND_ERROR_CODE, createFlatRequest, createRequest } from '@sa/axios';
 import { localStg } from '@/utils/storage';
 import { createProxyPattern, createServiceConfig } from '~/env.config';
 
@@ -6,20 +6,89 @@ const { baseURL, otherBaseURL } = createServiceConfig(import.meta.env);
 
 const isHttpProxy = import.meta.env.VITE_HTTP_PROXY === 'Y';
 
-export const request = createRequest({
-  baseURL: isHttpProxy ? createProxyPattern() : baseURL,
-  headers: {
-    apifoxToken: 'XL299LiMEDZ0H5h3A29PxwQXdMJqWyY2'
+export const request = createFlatRequest<App.Service.Response>(
+  {
+    baseURL: isHttpProxy ? createProxyPattern() : baseURL,
+    headers: {
+      apifoxToken: 'XL299LiMEDZ0H5h3A29PxwQXdMJqWyY2'
+    }
   },
-  onRequest({ options }) {
-    if (options.headers) {
+  {
+    async onRequest(config) {
+      const { headers } = config;
+
+      // set token
       const token = localStg.get('token');
+      const Authorization = token ? `Bearer ${token}` : null;
+      Object.assign(headers, { Authorization });
 
-      const Authorization = token ? `Bearer ${token}` : '';
+      return config;
+    },
+    isBackendSuccess(response) {
+      // when the backend response code is "0000", it means the request is success
+      // you can change this logic by yourself
+      return response.data.code === '0000';
+    },
+    async onBackendFail(_response) {
+      // when the backend response code is not 200, it means the request is fail
+      // for example: the token is expired, refetch token and retry request
+    },
+    transformBackendResponse(response) {
+      return response.data.data;
+    },
+    onError(error) {
+      // when the request is fail, you can show error message
 
-      Object.assign(options.headers, { Authorization });
+      let message = error.message;
+
+      // show backend error message
+      if (error.code === BACKEND_ERROR_CODE) {
+        message = error.request?.data.msg || message;
+      }
+
+      window.$message?.error(message);
     }
   }
-});
+);
 
-export const demoRequest = createRequest({ baseURL: isHttpProxy ? createProxyPattern('demo') : otherBaseURL.demo });
+export const demoRequest = createRequest<App.Service.DemoResponse>(
+  {
+    baseURL: isHttpProxy ? createProxyPattern('demo') : otherBaseURL.demo
+  },
+  {
+    async onRequest(config) {
+      const { headers } = config;
+
+      // set token
+      const token = localStg.get('token');
+      const Authorization = token ? `Bearer ${token}` : null;
+      Object.assign(headers, { Authorization });
+
+      return config;
+    },
+    isBackendSuccess(response) {
+      // when the backend response code is 200, it means the request is success
+      // you can change this logic by yourself
+      return response.data.status === '200';
+    },
+    async onBackendFail(_response) {
+      // when the backend response code is not 200, it means the request is fail
+      // for example: the token is expired, refetch token and retry request
+    },
+    transformBackendResponse(response) {
+      return response.data.result;
+    },
+    onError(error) {
+      // when the request is fail, you can show error message
+
+      let message = error.message;
+
+      // show backend error message
+      if (error.code === BACKEND_ERROR_CODE) {
+        message = error.request?.data.message || message;
+      }
+
+      window.$message?.error(message);
+    }
+  }
+);