fix: 修复 store 中并未对 localStorage 的 TOKEN_NAME 键进行赋值的缺陷 (#504)

* fix: 接口请求不携带token

* fix: 优化token持久化策略

* fix: 删除多余的log
This commit is contained in:
Gui.H 2023-05-18 11:29:01 +08:00 committed by GitHub
parent 03adc83ba2
commit 665e0dacec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 9 deletions

View File

@ -4,6 +4,7 @@ import NProgress from 'nprogress'; // progress bar
import { MessagePlugin } from 'tdesign-vue-next'; import { MessagePlugin } from 'tdesign-vue-next';
import { RouteRecordRaw } from 'vue-router'; import { RouteRecordRaw } from 'vue-router';
import { TOKEN_NAME } from '@/config/global';
import router from '@/router'; import router from '@/router';
import { getPermissionStore, getUserStore } from '@/store'; import { getPermissionStore, getUserStore } from '@/store';
import { PAGE_NOT_FOUND_ROUTE } from '@/utils/route/constant'; import { PAGE_NOT_FOUND_ROUTE } from '@/utils/route/constant';
@ -17,8 +18,8 @@ router.beforeEach(async (to, from, next) => {
const { whiteListRouters } = permissionStore; const { whiteListRouters } = permissionStore;
const userStore = getUserStore(); const userStore = getUserStore();
const { token } = userStore;
if (token) { if (userStore[TOKEN_NAME]) {
if (to.path === '/login') { if (to.path === '/login') {
next(); next();
return; return;

View File

@ -10,7 +10,7 @@ const InitUserInfo = {
export const useUserStore = defineStore('user', { export const useUserStore = defineStore('user', {
state: () => ({ state: () => ({
token: localStorage.getItem(TOKEN_NAME) || 'main_token', // 默认token不走权限 [TOKEN_NAME]: 'main_token', // 默认token不走权限
userInfo: { ...InitUserInfo }, userInfo: { ...InitUserInfo },
}), }),
getters: { getters: {
@ -49,7 +49,7 @@ export const useUserStore = defineStore('user', {
const res = await mockLogin(userInfo); const res = await mockLogin(userInfo);
if (res.code === 200) { if (res.code === 200) {
this.token = res.data; this.setToken(res.data);
} else { } else {
throw res; throw res;
} }
@ -67,17 +67,19 @@ export const useUserStore = defineStore('user', {
roles: ['UserIndex', 'DashboardBase', 'login'], // 前端权限模型使用 如果使用请配置modules/permission-fe.ts使用 roles: ['UserIndex', 'DashboardBase', 'login'], // 前端权限模型使用 如果使用请配置modules/permission-fe.ts使用
}; };
}; };
const res = await mockRemoteUserInfo(this.token); const res = await mockRemoteUserInfo(this[TOKEN_NAME]);
this.userInfo = res; this.userInfo = res;
}, },
async logout() { async logout() {
localStorage.removeItem(TOKEN_NAME); this.removeToken();
this.token = '';
this.userInfo = { ...InitUserInfo }; this.userInfo = { ...InitUserInfo };
}, },
async removeToken() { async removeToken() {
this.token = ''; this.setToken('');
},
async setToken(token: string) {
this[TOKEN_NAME] = token;
}, },
}, },
persist: { persist: {
@ -85,6 +87,8 @@ export const useUserStore = defineStore('user', {
const permissionStore = usePermissionStore(); const permissionStore = usePermissionStore();
permissionStore.initRoutes(); permissionStore.initRoutes();
}, },
key: 'user',
paths: [TOKEN_NAME],
}, },
}); });

View File

@ -5,6 +5,7 @@ import merge from 'lodash/merge';
import { TOKEN_NAME } from '@/config/global'; import { TOKEN_NAME } from '@/config/global';
import { ContentTypeEnum } from '@/constants'; import { ContentTypeEnum } from '@/constants';
import { getUserStore } from '@/store';
import { VAxios } from './Axios'; import { VAxios } from './Axios';
import type { AxiosTransform, CreateAxiosOptions } from './AxiosTransform'; import type { AxiosTransform, CreateAxiosOptions } from './AxiosTransform';
@ -113,7 +114,9 @@ const transform: AxiosTransform = {
// 请求拦截器处理 // 请求拦截器处理
requestInterceptors: (config, options) => { requestInterceptors: (config, options) => {
// 请求之前处理config // 请求之前处理config
const token = localStorage.getItem(TOKEN_NAME); const userStore = getUserStore();
const token = userStore[TOKEN_NAME];
if (token && (config as Recordable)?.requestOptions?.withToken !== false) { if (token && (config as Recordable)?.requestOptions?.withToken !== false) {
// jwt token // jwt token
(config as Recordable).headers.Authorization = options.authenticationScheme (config as Recordable).headers.Authorization = options.authenticationScheme