修改请求

.umirc.ts

@@ -56,4 +56,11 @@ export default defineConfig({
   plugins: ["@umijs/plugins/dist/react-query"],
   reactQuery: {},
   npmClient: "npm",
+  proxy: {
+    "/ball/v1/api": {
+      target: "http://127.0.0.1:13005",
+      changeOrigin: true,
+      // pathRewrite: { "^/api": "" },
+    },
+  },
 });

config/config.ts

@@ -1,11 +0,0 @@
-import {defineConfig} from 'umi';
- 
-export default defineConfig({
-  proxy: {
-    "/ball/v1/api": {
-      target: "http://127.0.0.1:13005",
-      changeOrigin: true,
-      // pathRewrite: { "^/api": "" },
-    },
-  },
-});

package.json

@@ -12,7 +12,8 @@
     "@ant-design/pro-layout": "^7.16.0",
     "antd": "^5.7.0",
     "axios": "^1.4.0",
-    "umi": "^4.0.72"
+    "umi": "^4.0.72",
+    "umi-request": "^1.4.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.33",

src/pages/products/index.tsx

@@ -1,6 +1,7 @@
 import axios from 'axios';
 import { useMutation, useQuery, useQueryClient } from 'umi';
-import { Table } from 'antd';
+import { Table ,Button} from 'antd';
+import { getUser } from '@/services/user';
 import styles from './index.less';
 
 export default function Page() {
@@ -21,6 +22,10 @@ export default function Page() {
     key: 'address',
   },
  ];
+ const toUser = async () => {
+   const response = await getUser({type:'0'});
+   console.log(response);
+  };
   const queryClient = useQueryClient();
   const productsQuery = useQuery(['products'], {
     queryFn() {
@@ -38,8 +43,9 @@ export default function Page() {
   if (productsQuery.isLoading) return null;
   return (
     <div>
-      <h1 className={styles.title}>Page products</h1>
+      <h1 className={styles.title}>茶副产品</h1>
       <Table dataSource={productsQuery.data.data} columns={columns} />
+      <Button type="primary" onClick={toUser}>查询</Button>
     </div>
-  );
+  ); 
 }

src/services/user.ts

@@ -0,0 +1,15 @@
+import { request } from "@/utils/request";
+
+export async function postUser(params?: any): Promise<any> {
+  return request(`/user`, {
+    method: "post",
+    data: params,
+  });
+}
+ 
+export async function getUser(params: any): Promise<any> {
+  return request(`/user`, {
+    method: "get",
+    params,
+  });
+}

src/utils/request.ts

@@ -0,0 +1,81 @@
+import { notification } from 'antd';
+import { history } from 'umi';
+import { extend } from 'umi-request';
+ 
+ 
+/** 异常处理程序 */
+const codeMessage : any = {
+  200: '服务器成功返回请求的数据。',
+  201: '新建或修改数据成功。',
+  202: '一个请求已经进入后台排队（异步任务）。',
+  204: '删除数据成功。',
+  400: '发出的请求有错误，服务器没有进行新建或修改数据的操作。',
+  401: '用户没有权限（令牌、用户名、密码错误）。',
+  403: '用户得到授权，但是访问是被禁止的。',
+  404: '发出的请求针对的是不存在的记录，服务器没有进行操作。',
+  406: '请求的格式不可得。',
+  410: '请求的资源被永久删除，且不会再得到的。',
+  422: '当创建一个对象时，发生一个验证错误。',
+  500: '服务器发生错误，请检查服务器。',
+  502: '网关错误。',
+  503: '服务不可用，服务器暂时过载或维护。',
+  504: '网关超时。',
+};
+ 
+const errorHandler = (error: any) => {
+  const { response } = error;
+  if (response && response.status) {
+    const errorText = codeMessage[response.status] || response.statusText;
+    const { status, url } = response;
+    notification.error({
+      message: `请求错误 ${status}: ${url}`,
+      description: errorText,
+    });
+  } else if (!response) {
+    notification.error({
+      description: '网络异常，无法连接服务器',
+      message: '网络异常',
+    });
+  }
+  return response;
+};
+ 
+//对 extend 实例进行简单的封装
+export const request = extend({
+  prefix: "/ball/v1/api", // 统一的请求前缀
+  timeout: 3000, // 超时时间
+  headers: {
+    // headers中搭载token等请求头信息
+    "Content-Type": "application/x-www-form-urlencoded",
+    Authentication: localStorage.getItem("token") || "",
+  },
+  //处理请求错误 调用上面的错误处理逻辑
+  errorHandler: errorHandler,
+});
+ 
+ 
+// 对实例request进行请求拦截
+// 可以在里面对url、option中的参数进行进一步处理
+request.interceptors.request.use((url, options) => {
+  return {
+    options: {
+      ...options,
+      interceptors: true,
+    },
+  };
+});
+ 
+// 对实例request进行响应拦截, 统一处理接口错误信息
+request.interceptors.response.use(async (response) => {
+  if (response.status !== 200) {
+    switch (response.status) {
+      case 401:
+        notification.warning({
+          message: '登录超时，请重新登陆!',
+        });
+        history.push('/login');
+        break;
+    }
+  }
+  return response;
+});