From 236ddf3471a7851ff6541f5709e9cbb6105b58f7 Mon Sep 17 00:00:00 2001 From: xachary <179740385@qq.com> Date: Sun, 11 Feb 2024 14:30:44 +0800 Subject: [PATCH] fix: repair login about redirect query (#3592) * fix: repair login about redirect query * fix: about buildRoutesAction and redirect * fix: make sure unknown redirect will back to home --- src/hooks/web/usePermission.ts | 3 ++ src/router/guard/permissionGuard.ts | 67 ++++++++++++++++------------- src/store/modules/user.ts | 21 +++++++-- src/utils/http/axios/checkStatus.ts | 3 +- src/utils/http/axios/index.ts | 3 +- src/views/sys/lock/LockPage.vue | 1 + 6 files changed, 64 insertions(+), 34 deletions(-) diff --git a/src/hooks/web/usePermission.ts b/src/hooks/web/usePermission.ts index 2ffc61ee..0aca576d 100644 --- a/src/hooks/web/usePermission.ts +++ b/src/hooks/web/usePermission.ts @@ -46,10 +46,13 @@ export function usePermission() { const tabStore = useMultipleTabStore(); tabStore.clearCacheTabs(); resetRouter(); + + // 动态加载路由（再次） const routes = await permissionStore.buildRoutesAction(); routes.forEach((route) => { router.addRoute(route as unknown as RouteRecordRaw); }); + permissionStore.setLastBuildMenuTime(); closeAll(); } diff --git a/src/router/guard/permissionGuard.ts b/src/router/guard/permissionGuard.ts index 8f1bad33..07bd7ea4 100644 --- a/src/router/guard/permissionGuard.ts +++ b/src/router/guard/permissionGuard.ts @@ -38,7 +38,7 @@ export function createPermissionGuard(router: Router) { try { await userStore.afterLoginAction(); if (!isSessionTimeout) { - next((to.query?.redirect as string) || '/'); + next(decodeURIComponent((to.query?.redirect as string) || '/')); return; } } catch { @@ -71,16 +71,6 @@ export function createPermissionGuard(router: Router) { return; } - // Jump to the 404 page after processing the login - if ( - from.path === LOGIN_PATH && - to.name === PAGE_NOT_FOUND_ROUTE.name && - to.fullPath !== (userStore.getUserInfo.homePath || PageEnum.BASE_HOME) - ) { - next(userStore.getUserInfo.homePath || PageEnum.BASE_HOME); - return; - } - // get userinfo while last fetch time is empty if (userStore.getLastUpdateTime === 0) { try { @@ -91,29 +81,48 @@ export function createPermissionGuard(router: Router) { } } - if (permissionStore.getIsDynamicAddedRoute) { - next(); + // 动态路由加载（首次） + if (!permissionStore.getIsDynamicAddedRoute) { + const routes = await permissionStore.buildRoutesAction(); + [...routes, PAGE_NOT_FOUND_ROUTE].forEach((route) => { + router.addRoute(route as unknown as RouteRecordRaw); + }); + // 记录动态路由加载完成 + permissionStore.setDynamicAddedRoute(true); + + // 现在的to动态路由加载之前的，可能为PAGE_NOT_FOUND_ROUTE（例如，登陆后，刷新的时候） + // 此处应当重定向到fullPath，否则会加载404页面内容 + next({ path: to.fullPath, replace: true, query: to.query }); return; } - const routes = await permissionStore.buildRoutesAction(); - - routes.forEach((route) => { - router.addRoute(route as unknown as RouteRecordRaw); - }); - - router.addRoute(PAGE_NOT_FOUND_ROUTE as unknown as RouteRecordRaw); - - permissionStore.setDynamicAddedRoute(true); - if (to.name === PAGE_NOT_FOUND_ROUTE.name) { - // 动态添加路由后，此处应当重定向到fullPath，否则会加载404页面内容 - next({ path: to.fullPath, replace: true, query: to.query }); + // 遇到不存在页面，后续逻辑不再处理redirect（阻止下面else逻辑） + from.query.redirect = ''; + + if ( + from.path === LOGIN_PATH && + to.fullPath !== (userStore.getUserInfo.homePath || PageEnum.BASE_HOME) + ) { + // 登陆重定向不存在路由，转去“首页” + next({ path: userStore.getUserInfo.homePath || PageEnum.BASE_HOME, replace: true }); + } else { + // 正常前往“404”页面 + next(); + } + } else if (from.query.redirect) { + // 存在redirect + const redirect = decodeURIComponent((from.query.redirect as string) || ''); + if (redirect === to.fullPath) { + // 已经被redirect + next(); + } else { + // 指向redirect + next({ path: redirect, replace: true }); + } } else { - const redirectPath = (from.query.redirect || to.path) as string; - const redirect = decodeURIComponent(redirectPath); - const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }; - next(nextData); + // 正常访问 + next(); } }); } diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts index 5906f925..12bfb973 100644 --- a/src/store/modules/user.ts +++ b/src/store/modules/user.ts @@ -110,14 +110,17 @@ export const useUserStore = defineStore({ this.setSessionTimeout(false); } else { const permissionStore = usePermissionStore(); + + // 动态路由加载（首次） if (!permissionStore.isDynamicAddedRoute) { const routes = await permissionStore.buildRoutesAction(); - routes.forEach((route) => { + [...routes, PAGE_NOT_FOUND_ROUTE].forEach((route) => { router.addRoute(route as unknown as RouteRecordRaw); }); - router.addRoute(PAGE_NOT_FOUND_ROUTE as unknown as RouteRecordRaw); + // 记录动态路由加载完成 permissionStore.setDynamicAddedRoute(true); } + goHome && (await router.replace(userInfo?.homePath || PageEnum.BASE_HOME)); } return userInfo; @@ -150,7 +153,18 @@ export const useUserStore = defineStore({ this.setToken(undefined); this.setSessionTimeout(false); this.setUserInfo(null); - goLogin && router.push(PageEnum.BASE_LOGIN); + if (goLogin) { + // 直接回登陆页 + router.replace(PageEnum.BASE_LOGIN); + } else { + // 回登陆页带上当前路由地址 + router.replace({ + path: PageEnum.BASE_LOGIN, + query: { + redirect: encodeURIComponent(router.currentRoute.value.fullPath), + }, + }); + } }, /** @@ -164,6 +178,7 @@ export const useUserStore = defineStore({ title: () => h('span', t('sys.app.logoutTip')), content: () => h('span', t('sys.app.logoutMessage')), onOk: async () => { + // 主动登出，不带redirect地址 await this.logout(true); }, }); diff --git a/src/utils/http/axios/checkStatus.ts b/src/utils/http/axios/checkStatus.ts index a2929333..10d7267a 100644 --- a/src/utils/http/axios/checkStatus.ts +++ b/src/utils/http/axios/checkStatus.ts @@ -33,7 +33,8 @@ export function checkStatus( if (stp === SessionTimeoutProcessingEnum.PAGE_COVERAGE) { userStore.setSessionTimeout(true); } else { - userStore.logout(true); + // 被动登出，带redirect地址 + userStore.logout(false); } break; case 403: diff --git a/src/utils/http/axios/index.ts b/src/utils/http/axios/index.ts index c5757257..7b7b8f28 100644 --- a/src/utils/http/axios/index.ts +++ b/src/utils/http/axios/index.ts @@ -77,7 +77,8 @@ const transform: AxiosTransform = { case ResultEnum.TIMEOUT: timeoutMsg = t('sys.api.timeoutMessage'); const userStore = useUserStoreWithOut(); - userStore.logout(true); + // 被动登出，带redirect地址 + userStore.logout(false); break; default: if (message) { diff --git a/src/views/sys/lock/LockPage.vue b/src/views/sys/lock/LockPage.vue index 3dc2e546..ea23afec 100644 --- a/src/views/sys/lock/LockPage.vue +++ b/src/views/sys/lock/LockPage.vue @@ -124,6 +124,7 @@ } function goLogin() { + // 主动登出，不带redirect地址 userStore.logout(true); lockStore.resetLockInfo(); }