🐛 fix client id persistence issue
This commit is contained in:
@@ -28,13 +28,11 @@ const router: Router = createRouter({
|
|||||||
router.beforeEach((to, _from, next) => {
|
router.beforeEach((to, _from, next) => {
|
||||||
start();
|
start();
|
||||||
const user = useStore().user;
|
const user = useStore().user;
|
||||||
const client = useStore().client;
|
|
||||||
const token: string | undefined = user.user.refreshToken;
|
const token: string | undefined = user.user.refreshToken;
|
||||||
const userId: string | undefined = user.user.userId;
|
const userId: string | undefined = user.user.userId;
|
||||||
const clientId: string | undefined = client.getClientId();
|
|
||||||
|
|
||||||
// 检查用户是否已登录
|
// 检查用户是否已登录
|
||||||
const isLoggedIn: boolean = token !== "" && userId !== "" && clientId !== "";
|
const isLoggedIn: boolean = token !== "" && userId !== "";
|
||||||
|
|
||||||
if (to.path === '/login' || to.path === '/qrlogin' || to.path === '/resetpass') {
|
if (to.path === '/login' || to.path === '/qrlogin' || to.path === '/resetpass') {
|
||||||
if (isLoggedIn) {
|
if (isLoggedIn) {
|
||||||
|
@@ -20,12 +20,12 @@ export const useClientStore = defineStore(
|
|||||||
getClientId
|
getClientId
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
// 开启数据持久化
|
// // 开启数据持久化
|
||||||
persist: {
|
// persist: {
|
||||||
key: 'clientId',
|
// key: 'clientId',
|
||||||
storage: localStorage,
|
// storage: localStorage,
|
||||||
paths: ["clientId"],
|
// paths: ["clientId"],
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
);
|
);
|
||||||
|
@@ -6,11 +6,10 @@ import {localforageStorageAdapter} from "@/utils/alova/adapter/localforageStorag
|
|||||||
import {createServerTokenAuthentication} from "alova/client";
|
import {createServerTokenAuthentication} from "alova/client";
|
||||||
import {AxiosError, AxiosResponse} from "axios";
|
import {AxiosError, AxiosResponse} from "axios";
|
||||||
import {handleCode} from "@/utils/errorCode/errorCodeHandler.ts";
|
import {handleCode} from "@/utils/errorCode/errorCodeHandler.ts";
|
||||||
import {message, notification} from "ant-design-vue";
|
import {message} from "ant-design-vue";
|
||||||
import i18n from "@/locales";
|
import i18n from "@/locales";
|
||||||
import {axiosRequestAdapter} from "@alova/adapter-axios";
|
import {axiosRequestAdapter} from "@alova/adapter-axios";
|
||||||
import {refreshToken} from "@/api/user";
|
import {refreshToken} from "@/api/user";
|
||||||
import router from "@/router/router.ts";
|
|
||||||
|
|
||||||
let hasShownNetworkError: boolean = false;
|
let hasShownNetworkError: boolean = false;
|
||||||
const {onAuthRequired, onResponseRefreshToken} = createServerTokenAuthentication<typeof VueHook,
|
const {onAuthRequired, onResponseRefreshToken} = createServerTokenAuthentication<typeof VueHook,
|
||||||
@@ -18,30 +17,27 @@ const {onAuthRequired, onResponseRefreshToken} = createServerTokenAuthentication
|
|||||||
refreshTokenOnSuccess: {
|
refreshTokenOnSuccess: {
|
||||||
// 在请求前触发,将接收到method参数,并返回boolean表示token是否过期
|
// 在请求前触发,将接收到method参数,并返回boolean表示token是否过期
|
||||||
isExpired: (response: AxiosResponse<any, any>, _method: any) => {
|
isExpired: (response: AxiosResponse<any, any>, _method: any) => {
|
||||||
return response.data.code === 401;
|
const code = response.data.code;
|
||||||
|
return code === 401;
|
||||||
},
|
},
|
||||||
|
|
||||||
// 当token过期时触发,在此函数中触发刷新token
|
// 当token过期时触发,在此函数中触发刷新token
|
||||||
handler: async () => {
|
handler: async () => {
|
||||||
try {
|
// 刷新token
|
||||||
// 刷新token
|
const user = useStore().user;
|
||||||
const user = useStore().user;
|
const res: any = await refreshToken(user.user?.refreshToken);
|
||||||
const res: any = await refreshToken(user.user?.refreshToken);
|
if (res.code === 0 && res.data) {
|
||||||
if (res.code === 0 && res.data) {
|
const {access_token, refresh_token, uid} = res.data;
|
||||||
const {access_token, refresh_token, uid} = res.data;
|
user.user.accessToken = access_token;
|
||||||
user.user.accessToken = access_token;
|
user.user.refreshToken = refresh_token;
|
||||||
user.user.refreshToken = refresh_token;
|
user.user.uid = uid;
|
||||||
user.user.uid = uid;
|
} else {
|
||||||
} else {
|
|
||||||
message.error(i18n.global.t('error.loginExpired'));
|
|
||||||
localStorage.removeItem('user');
|
|
||||||
router.push('/login').then();
|
|
||||||
}
|
|
||||||
} catch (error: any) {
|
|
||||||
console.error(error);
|
|
||||||
message.error(i18n.global.t('error.loginExpired'));
|
message.error(i18n.global.t('error.loginExpired'));
|
||||||
localStorage.removeItem('user');
|
localStorage.removeItem('user');
|
||||||
router.push('/login').then();
|
localStorage.removeItem('clientId');
|
||||||
|
setTimeout(() => {
|
||||||
|
window.location.href = '/login';
|
||||||
|
}, 2000);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -68,8 +64,6 @@ export const service = createAlova({
|
|||||||
}
|
}
|
||||||
const lang = useStore().lang;
|
const lang = useStore().lang;
|
||||||
method.config.headers['Accept-Language'] = lang.lang || 'zh';
|
method.config.headers['Accept-Language'] = lang.lang || 'zh';
|
||||||
const client = useStore().client;
|
|
||||||
method.config.headers['X-Request-Id'] = client.getClientId() || '';
|
|
||||||
}),
|
}),
|
||||||
// 响应拦截器
|
// 响应拦截器
|
||||||
responded: onResponseRefreshToken({
|
responded: onResponseRefreshToken({
|
||||||
@@ -79,21 +73,20 @@ export const service = createAlova({
|
|||||||
}
|
}
|
||||||
const {code} = response.data;
|
const {code} = response.data;
|
||||||
if (code === 403) {
|
if (code === 403) {
|
||||||
notification.error({
|
localStorage.removeItem('user');
|
||||||
placement: 'topRight',
|
localStorage.removeItem('clientId');
|
||||||
duration: 5,
|
message.open({
|
||||||
message: i18n.global.t('error.loginExpired'),
|
type: 'error',
|
||||||
description: i18n.global.t('error.loginExpiredDesc'),
|
content: i18n.global.t('error.loginExpired'),
|
||||||
onClose: () => {
|
duration: 2,
|
||||||
localStorage.removeItem('user');
|
|
||||||
router.push('/login').then();
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
setTimeout(() => {
|
||||||
throw new Error('Authentication Expired');
|
window.location.href = '/login';
|
||||||
} else {
|
}, 2000);
|
||||||
return response.data;
|
return Promise.reject(response.data);
|
||||||
}
|
}
|
||||||
|
return response.data;
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
onError:
|
onError:
|
||||||
|
Reference in New Issue
Block a user