refactor(projects): 请求函数重构初步

src/service/request/helpers/error.ts

@@ -0,0 +1,50 @@
+const ERROR_STATUS = {
+  400: '400: 请求出现语法错误',
+  401: '401: 用户未授权~',
+  403: '403: 服务器拒绝访问~',
+  404: '404: 请求的资源不存在~',
+  405: '405: 请求方法未允许~',
+  408: '408: 网络请求超时~',
+  500: '500: 服务器内部错误~',
+  501: '501: 服务器未实现请求功能~',
+  502: '502: 错误网关~',
+  503: '503: 服务不可用~',
+  504: '504: 网关超时~',
+  505: '505: http版本不支持该请求~'
+};
+
+type ErrorStatus = keyof typeof ERROR_STATUS;
+
+type ErrorMsg = [boolean, string];
+/**
+ * 获取请求失败的错误
+ * @param error
+ */
+export function getFailRequestErrorMsg(error: any) {
+  const errorAction: ErrorMsg[] = [
+    [!window.navigator.onLine || error.message === 'Network Error', '网络不可用~'],
+    [error.code === 'ECONNABORTED' && error.message.includes('timeout'), '网络连接超时~'],
+    [error.response, ERROR_STATUS[error.response.status as ErrorStatus]]
+  ];
+  let errorMsg = '请求错误~';
+  errorAction.some(item => {
+    const [flag, msg] = item;
+    if (flag) {
+      errorMsg = msg;
+    }
+    return flag;
+  });
+  return errorMsg;
+}
+
+/**
+ * 处理请求失败的错误
+ * @param error - 错误
+ */
+export function handleResponseError(error: any) {
+  const { $message: Message } = window;
+
+  const msg = getFailRequestErrorMsg(error);
+
+  Message?.error(msg);
+}

src/service/request/helpers/handler.ts

@@ -0,0 +1,16 @@
+// type ResultHandler<T> = (...arg: any) => T;
+// type SuccessRequest<T> = {
+//   error: null;
+//   data: T;
+// };
+// type FailRequest = {
+//   error: any;
+//   data: null;
+// };
+// type RequestResult<T> = SuccessRequest<T> | FailRequest;
+// /**
+//  * 对请求的结果数据进行格式化的处理
+//  * @param handleFunc - 处理函数
+//  * @param requests - 请求结果
+//  */
+// export function handleResponse<ResponseData>(resultHandler: ResultHandler<ResponseData>, requests: RequestResult[]) {}

src/service/request/helpers/index.ts

@@ -0,0 +1,2 @@
+export * from './transform';
+export * from './error';

src/service/request/helpers/transform.ts

@@ -0,0 +1,40 @@
+import qs from 'qs';
+import FormData from 'form-data';
+import { isArray } from '@/utils';
+import { ContentType } from '@/enum';
+
+export async function transformRequestData(requestData: any, contentType?: string) {
+  // application/json类型不处理
+  let data = requestData;
+  // form类型转换
+  if (contentType === ContentType.formUrlencoded) {
+    data = qs.stringify(requestData);
+  }
+  // form-data类型转换
+  if (contentType === ContentType.formData) {
+    const key = Object.keys(requestData)[0];
+    const file = requestData.data[key];
+    data = await transformFile(file, key);
+  }
+  return data;
+}
+
+/**
+ * 接口为上传文件的类型时数据转换
+ * @param file - 单文件或多文件
+ * @param key - 文件的属性名
+ */
+async function transformFile(file: File[] | File, key: string) {
+  const formData = new FormData();
+  if (isArray(file)) {
+    await Promise.all(
+      (file as File[]).map(item => {
+        formData.append(key, item);
+        return true;
+      })
+    );
+  } else {
+    await formData.append(key, file);
+  }
+  return formData;
+}