@jetlinks-web/core 2.2.0 → 2.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jetlinks-web/core",
-  "version": "2.2.0",
+  "version": "2.2.2",
   "main": "index.ts",
   "module": "index.ts",
   "keywords": [
@@ -22,8 +22,8 @@
     "axios": "^1.7.4",
     "rxjs": "^7.8.1",
     "@jetlinks-web/constants": "^1.0.9",
-    "@jetlinks-web/utils": "^1.2.8",
-    "@jetlinks-web/types": "^1.0.2"
+    "@jetlinks-web/types": "^1.0.2",
+    "@jetlinks-web/utils": "^1.2.8"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

package/src/axios.ts

@@ -1,5 +1,5 @@
 import { TOKEN_KEY, BASE_API } from '@jetlinks-web/constants'
-import { getToken } from '@jetlinks-web/utils'
+import {getToken, randomString} from '@jetlinks-web/utils'
 import axios from 'axios'
 import type {
   AxiosInstance,
@@ -13,6 +13,7 @@ import {isFunction, isObject} from 'lodash-es'
 interface Options {
 
   tokenExpiration: (err: AxiosError<any>, response: AxiosResponse) => void
+  handleReconnect: (err: AxiosError<any>, response: AxiosResponse) => Promise<any>
   filter_url?: Array<string>
   code?: number
   codeKey?: string
@@ -35,7 +36,7 @@ interface Options {
    */
   handleError?: (msg: string, status: string | number, error: AxiosError<any>) => void
   requestOptions?: (config: InternalAxiosRequestConfig) => InternalAxiosRequestConfig | Record<string, any>
-
+  isCreateTokenRefresh?: boolean
 }
 
 interface RequestOptions {
@@ -58,13 +59,33 @@ let _options: Options = {
   langKey: 'lang',
   requestOptions: (config) => ({}),
   tokenExpiration: () => {},
+  handleReconnect: () => new Promise(),
+  isCreateTokenRefresh: false
 }
 
+let failedQueue = [];
+let isRefreshing = false;
+
 const isApp = (window as any).__MICRO_APP_ENVIRONMENT__
-const controller = new AbortController();
 
+const pendingRequests = new Map<string, AbortController>();
+const requestRecords = (config: InternalAxiosRequestConfig) => {
+  const key = randomString(32)
+
+  // 取消重复请求
+  if (pendingRequests.has(key)) {
+    pendingRequests.get(key)?.abort()
+  }
+
+  const controller = new AbortController()
+  config.signal = controller.signal;
+  config.__requestKey = key;
+
+  pendingRequests.set(key, controller)
+}
 const handleRequest = (config: InternalAxiosRequestConfig) => {
-  const token = getToken()
+  requestRecords(config)
+  const token = getToken();
   const lang = localStorage.getItem(_options.langKey)
   const localBaseApi = localStorage.getItem('')
 
@@ -97,16 +118,19 @@ const handleRequest = (config: InternalAxiosRequestConfig) => {
     }
   }
 
-
   return config
 }
 
 const handleResponse = (response: AxiosResponse) => {
-
   if (_options.handleResponse && isFunction(_options.handleResponse)) {
     return _options.handleResponse(response)
   }
 
+  const __key = response.config?.__requestKey
+  if(__key){
+    pendingRequests.delete(__key)
+  }
+
   if (response.data instanceof ArrayBuffer) {
     return response
   }
@@ -124,7 +148,35 @@ const handleResponse = (response: AxiosResponse) => {
   return response.data
 }
 
-const errorHandler = (err: AxiosError<any>) => {
+const createTokenRefreshHandler = async (err) => {
+  const originalRequest = err.config;
+  if (isRefreshing) { // 记录之后失败的请求
+    return new Promise((resolve, reject) => {
+      failedQueue.push({ resolve, reject });
+    }).then((_token) => {
+      originalRequest.headers[TOKEN_KEY] = _token;
+      instance(originalRequest)
+    }).catch(err => Promise.reject(err))
+  }
+  originalRequest._retry = true;
+  isRefreshing = true;
+  try {
+    const loginResult = await _options.handleReconnect?.()
+    if(loginResult){
+      const token = getToken() // 更新请求头, 修改全部的token
+      originalRequest.headers[TOKEN_KEY] = token;
+      failedQueue.forEach(a => a.resolve(token));
+      return instance(originalRequest);
+    }
+  } catch (err) {
+    failedQueue.forEach(cb => cb.reject(err));
+    throw err;
+  } finally {
+    failedQueue = [];
+    isRefreshing = false;
+  }
+}
+const errorHandler = async (err: AxiosError<any>) => {
   let description = err.response?.message || 'Error'
   let _status: string | number = 0
   if (err.response) {
@@ -137,8 +189,11 @@ const errorHandler = (err: AxiosError<any>) => {
         description = (`${data?.message}`).substring(0, 90)
         break;
       case 401:
-        description = err.response.data.result.text || '用户未登录'
-        _options.tokenExpiration?.(err, err.response)
+        description = err.response.data.result.text || '用户未登录';
+        _options.tokenExpiration?.()
+        if(_options.isCreateTokenRefresh){
+          return createTokenRefreshHandler(err)
+        }
         break;
       case 404:
         description = err?.response?.data?.message || `${data?.error} ${data?.path}`
@@ -158,6 +213,11 @@ const errorHandler = (err: AxiosError<any>) => {
   return Promise.reject(err)
 }
 
+export const abortAllRequests = () => {
+  pendingRequests.forEach(controller => controller.abort())
+  pendingRequests.clear()
+}
+
 export const crateAxios = (options: Options) => {
   if (options) {
     _options = Object.assign(_options, options)

package/src/websocket.ts

@@ -1,10 +1,7 @@
-import { wsClient } from '@/utils/websocket';
 import { webSocket, WebSocketSubject } from 'rxjs/webSocket';
 import { Observable, Subject, timer, Subscription, EMPTY } from 'rxjs';
 import { retry, catchError } from 'rxjs/operators';
 import { notification } from 'ant-design-vue';
-import app from '@micro-zoe/micro-app'
-import { log } from 'console';
 
 interface WebSocketMessage {
   type: string;
@@ -36,7 +33,7 @@ export class WebSocketClient {
   private wsClient: WebSocketClient | undefined
 
   constructor(options?: WS_Options) {
-    this.options = options || {};
+    this.setOptions(options)
     this.setupConnectionMonitor();
     if (isApp) {
       (window as any).microApp.addGlobalDataListener((data) => {
@@ -45,6 +42,10 @@ export class WebSocketClient {
     }
   }
 
+  public setOptions(options: WS_Options) {
+    this.options = options || {}
+  }
+
   public initWebSocket(url: string) {
     this.url = url;
   }