Browse Source

chore(utils): 添加Cookie管理与Pinia状态管理

wangshun 4 days ago
parent
commit
2c22d8f527
3 changed files with 46 additions and 24 deletions
  1. 20 0
      src/stores/user-info.ts
  2. 15 0
      src/utils/auth.ts
  3. 11 24
      src/utils/index.ts

+ 20 - 0
src/stores/user-info.ts

@@ -0,0 +1,20 @@
+import { ref } from 'vue';
+import { defineStore } from 'pinia';
+
+export const useUserInfoStore = defineStore('userInfo', () => {
+  const token = ref<string>();
+
+  const saveToken = (val: string) => {
+    token.value = val;
+  };
+
+  const resetToken = () => {
+    token.value = undefined;
+  };
+
+  return {
+    token,
+    saveToken,
+    resetToken,
+  };
+});

+ 15 - 0
src/utils/auth.ts

@@ -0,0 +1,15 @@
+import Cookies from 'js-cookie';
+
+export const TOKEN_KEY = 'X-Token';
+
+export const setToken = (token: string) => {
+  Cookies.set(TOKEN_KEY, token);
+};
+
+export const getToken = () => {
+  return Cookies.get(TOKEN_KEY);
+};
+
+export const removeToken = () => {
+  Cookies.remove(TOKEN_KEY);
+};

+ 11 - 24
src/utils/index.ts

@@ -1,9 +1,11 @@
 import dayjs from 'dayjs';
 import dayjs from 'dayjs';
 import { kebabCase } from 'lodash-es';
 import { kebabCase } from 'lodash-es';
 
 
+import { useUserInfoStore } from '@/stores/user-info';
 import { t } from '@/i18n';
 import { t } from '@/i18n';
 import { fileContentTypeRegExp, TimeScaleType } from '@/constants';
 import { fileContentTypeRegExp, TimeScaleType } from '@/constants';
 
 
+import { removeToken } from './auth';
 import { fetchWithTimeout } from './fetch';
 import { fetchWithTimeout } from './fetch';
 
 
 import type { SorterResult } from 'ant-design-vue/es/table/interface';
 import type { SorterResult } from 'ant-design-vue/es/table/interface';
@@ -17,17 +19,12 @@ export const request = async <T>(url: string, init: RequestInit = {}, timeout?:
   if (typeof init?.body === 'string') {
   if (typeof init?.body === 'string') {
     headers['Content-Type'] = 'application/json;charset=UTF-8';
     headers['Content-Type'] = 'application/json;charset=UTF-8';
   }
   }
-
-  // const { token, saveToken, resetToken } = useUserInfoStore();
-  // const { resetDevInfo } = useDeviceInfoStore();
-
-  // if (token) {
-  //   Object.assign(headers, {
-  //     [TOKEN_KEY]: token,
-  //   });
-  // }
-
-  headers['Authorization'] = 'Bearer ' + import.meta.env.VITE_TEMP_TOKEN;
+  const { token, resetToken } = useUserInfoStore();
+  if (token) {
+    Object.assign(headers, {
+      Authorization: 'Bearer ' + token,
+    });
+  }
 
 
   Object.assign(headers, init?.headers);
   Object.assign(headers, init?.headers);
 
 
@@ -41,11 +38,9 @@ export const request = async <T>(url: string, init: RequestInit = {}, timeout?:
   );
   );
 
 
   if (res.status === 401) {
   if (res.status === 401) {
-    // removeToken();
-    // resetToken();
-    // resetDevInfo();
-    // location.replace('/login');
-
+    removeToken();
+    resetToken();
+    location.replace('/login');
     throw new Error(t('common.reLogin'));
     throw new Error(t('common.reLogin'));
   }
   }
 
 
@@ -55,14 +50,6 @@ export const request = async <T>(url: string, init: RequestInit = {}, timeout?:
     throw new Error(`HTTP Error: ${res.status} ${errMsg}`);
     throw new Error(`HTTP Error: ${res.status} ${errMsg}`);
   }
   }
 
 
-  // if (res.url.includes('/Uboxlogin')) {
-  //   const token = res.headers.get(TOKEN_KEY);
-
-  //   if (token) {
-  //     setToken(token);
-  //     saveToken(token);
-  //   }
-  // }
   const contentType = res.headers.get('content-type');
   const contentType = res.headers.get('content-type');
   const isBlob = fileContentTypeRegExp.test(contentType || '');
   const isBlob = fileContentTypeRegExp.test(contentType || '');