Browse Source

feature: http封装

后羿 2 years ago
parent
commit
6e9ab20c8b
8 changed files with 116 additions and 5 deletions
  1. 77 0
      lib/http.js
  2. 1 0
      lib/index.js
  3. 1 1
      package.json
  4. 2 2
      sdk/http.ts
  5. 3 1
      tsconfig.json
  6. 30 0
      types/http.d.ts
  7. 1 0
      types/index.d.ts
  8. 1 1
      yarn.lock

+ 77 - 0
lib/http.js

@@ -0,0 +1,77 @@
+import axios from "axios";
+class WrappedAxios {
+    constructor(options = {}) {
+        this.instance = axios.create(Object.assign({ timeout: 10000 }, options));
+    }
+    beforeRequest(onFulfilled, onRejected, options) {
+        this.instance.interceptors.request.use(onFulfilled, onRejected, options);
+        return this;
+    }
+    afterResponse(onFulfilled, onRejected, options) {
+        this.instance.interceptors.response.use(onFulfilled, onRejected, options);
+        return this;
+    }
+    get axiosInstance() {
+        return this.instance;
+    }
+    get(url, data, config = {}) {
+        return this.instance.get(url, Object.assign({ params: data }, config));
+    }
+    post(url, data, config = {}) {
+        return this.instance.post(url, data, config);
+    }
+    put(url, data, config = {}) {
+        return this.instance.put(url, data, config);
+    }
+    delete(url, data, config = {}) {
+        return this.instance.delete(url, Object.assign({ params: data }, config));
+    }
+    createCancelObj(config = {}, send) {
+        const controller = new AbortController();
+        config.signal = controller.signal;
+        return {
+            cancel() {
+                controller.abort();
+            },
+            send,
+        };
+    }
+    createGetWithCancel(url, data, config = {}) {
+        return this.createCancelObj(config, () => {
+            return this.get(url, data, config);
+        });
+    }
+    createPostWithCancel(url, data, config = {}) {
+        return this.createCancelObj(config, () => {
+            return this.post(url, data, config);
+        });
+    }
+    createPutWithCancel(url, data, config = {}) {
+        return this.createCancelObj(config, () => {
+            return this.put(url, data, config);
+        });
+    }
+    createDeleteWithCancel(url, data, config = {}) {
+        return this.createCancelObj(config, () => {
+            return this.delete(url, data, config);
+        });
+    }
+}
+const http = new WrappedAxios();
+http
+    .beforeRequest((config) => {
+    config.headers.token = "123";
+    return config;
+})
+    .afterResponse((response) => {
+    return response.data;
+}, (error) => {
+    return Promise.reject(error);
+});
+http.get("/a", { a: 1 });
+const req = http.createGetWithCancel("/a", { a: 1 });
+req.send();
+setTimeout(() => {
+    req.cancel();
+});
+export { WrappedAxios };

+ 1 - 0
lib/index.js

@@ -2,3 +2,4 @@ export * from "./queue";
 export * from "./async";
 export * from "./async";
 export * from "./storage";
 export * from "./storage";
 export * from "./flexible";
 export * from "./flexible";
+export * from "./http";

+ 1 - 1
package.json

@@ -47,7 +47,7 @@
     "postcss-pxtorem": "^6.0.0",
     "postcss-pxtorem": "^6.0.0",
     "prettier": "^2.8.8",
     "prettier": "^2.8.8",
     "tslib": "^2.5.3",
     "tslib": "^2.5.3",
-    "typescript": "^5.1.3",
+    "typescript": "5",
     "vue-eslint-parser": "^9.3.1"
     "vue-eslint-parser": "^9.3.1"
   }
   }
 }
 }

+ 2 - 2
sdk/http.ts

@@ -1,4 +1,4 @@
-import axios from "node_modules/axios/index";
+import axios from "axios";
 import type {
 import type {
   CreateAxiosDefaults,
   CreateAxiosDefaults,
   AxiosInstance,
   AxiosInstance,
@@ -6,7 +6,7 @@ import type {
   AxiosRequestConfig,
   AxiosRequestConfig,
   InternalAxiosRequestConfig,
   InternalAxiosRequestConfig,
   AxiosResponse,
   AxiosResponse,
-} from "node_modules/axios/index";
+} from "axios";
 
 
 class WrappedAxios {
 class WrappedAxios {
   private instance?: AxiosInstance;
   private instance?: AxiosInstance;

+ 3 - 1
tsconfig.json

@@ -12,10 +12,12 @@
     "importHelpers": true,     
     "importHelpers": true,     
     "forceConsistentCasingInFileNames": true,
     "forceConsistentCasingInFileNames": true,
     "noUnusedLocals": true,
     "noUnusedLocals": true,
+
     "paths": {
     "paths": {
       "tslib" : ["node_modules/tslib/tslib.d.ts"],
       "tslib" : ["node_modules/tslib/tslib.d.ts"],
       "@/*": ["src/*"]
       "@/*": ["src/*"]
-    }
+    },
+    "moduleResolution": "node"
   },
   },
   "include": ["sdk/**/*.ts"],
   "include": ["sdk/**/*.ts"],
   "exclude": ["node_modules"]
   "exclude": ["node_modules"]

+ 30 - 0
types/http.d.ts

@@ -0,0 +1,30 @@
+import type { CreateAxiosDefaults, AxiosInstance, AxiosInterceptorOptions, AxiosRequestConfig, InternalAxiosRequestConfig, AxiosResponse } from "node_modules/axios/index";
+declare class WrappedAxios {
+    private instance?;
+    constructor(options?: CreateAxiosDefaults);
+    beforeRequest<V = any>(onFulfilled?: ((value: InternalAxiosRequestConfig<V>) => InternalAxiosRequestConfig<V> | Promise<InternalAxiosRequestConfig<V>>) | null, onRejected?: ((error: any) => any) | null, options?: AxiosInterceptorOptions): this;
+    afterResponse<V = any, D = any>(onFulfilled?: ((value: AxiosResponse<V, D>) => AxiosResponse<V, D> | Promise<AxiosResponse<V, D>>) | null, onRejected?: ((error: any) => any) | null, options?: AxiosInterceptorOptions): this;
+    get axiosInstance(): AxiosInstance;
+    get<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): Promise<R>;
+    post<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): Promise<R>;
+    put<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): Promise<R>;
+    delete<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): Promise<R>;
+    private createCancelObj;
+    createGetWithCancel<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): {
+        cancel(): void;
+        send: () => Promise<R>;
+    };
+    createPostWithCancel<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): {
+        cancel(): void;
+        send: () => Promise<R>;
+    };
+    createPutWithCancel<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): {
+        cancel(): void;
+        send: () => Promise<R>;
+    };
+    createDeleteWithCancel<R = any>(url: string, data: Record<string, any>, config?: AxiosRequestConfig): {
+        cancel(): void;
+        send: () => Promise<R>;
+    };
+}
+export { WrappedAxios };

+ 1 - 0
types/index.d.ts

@@ -2,3 +2,4 @@ export * from "./queue";
 export * from "./async";
 export * from "./async";
 export * from "./storage";
 export * from "./storage";
 export * from "./flexible";
 export * from "./flexible";
+export * from "./http";

+ 1 - 1
yarn.lock

@@ -6168,7 +6168,7 @@ type-is@~1.6.18:
     media-typer "0.3.0"
     media-typer "0.3.0"
     mime-types "~2.1.24"
     mime-types "~2.1.24"
 
 
-typescript@^5.1.3:
+typescript@5:
   version "5.1.3"
   version "5.1.3"
   resolved "https://registry.npmmirror.com/typescript/-/typescript-5.1.3.tgz#8d84219244a6b40b6fb2b33cc1c062f715b9e826"
   resolved "https://registry.npmmirror.com/typescript/-/typescript-5.1.3.tgz#8d84219244a6b40b6fb2b33cc1c062f715b9e826"
   integrity sha512-XH627E9vkeqhlZFQuL+UsyAXEnibT0kWR2FWONlr4sTjvxyJYnyefgrkyECLzM5NenmKzRAy2rR/OlYLA1HkZw==
   integrity sha512-XH627E9vkeqhlZFQuL+UsyAXEnibT0kWR2FWONlr4sTjvxyJYnyefgrkyECLzM5NenmKzRAy2rR/OlYLA1HkZw==