刷新多此会跳转到登陆的问题解决了,但是刷新会出现更逆天的问题
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import { hasValidToken, getUserInfo, logoutUser } from '../utils/jwt';
|
||||
import { hasValidToken, getUserInfo, logoutUser, getStoredUser } from '../utils/jwt';
|
||||
import { justLoggedIn } from '../utils/authSessionState';
|
||||
import EditorsMaps from '@/views/index/EditorsMaps.vue'
|
||||
|
||||
@@ -112,41 +112,45 @@ const router = createRouter({
|
||||
// 路由守卫
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
|
||||
|
||||
if (requiresAuth) {
|
||||
const tokenExists = hasValidToken();
|
||||
|
||||
if (justLoggedIn.value) {
|
||||
justLoggedIn.value = false;
|
||||
if (tokenExists) {
|
||||
next();
|
||||
} else {
|
||||
logoutUser();
|
||||
next({ path: '/backend/login', query: { redirect: to.fullPath, sessionExpired: 'true' }});
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (!requiresAuth) {
|
||||
return next(); // 如果页面不需要认证,直接放行
|
||||
}
|
||||
|
||||
if (tokenExists) {
|
||||
const user = await getUserInfo();
|
||||
if (user) {
|
||||
next();
|
||||
} else {
|
||||
logoutUser();
|
||||
next({
|
||||
path: '/backend/login',
|
||||
query: { redirect: to.fullPath, sessionExpired: 'true' }
|
||||
});
|
||||
}
|
||||
} else {
|
||||
next({
|
||||
// 方案1: 检查SessionStorage中是否已有用户信息 (刷新后最先检查这里)
|
||||
if (getStoredUser()) {
|
||||
return next();
|
||||
}
|
||||
|
||||
// 方案2: 如果刚登录过,直接放行
|
||||
if (justLoggedIn.value) {
|
||||
justLoggedIn.value = false;
|
||||
// 此时token肯定有效,但可能还没来得及请求用户信息
|
||||
// 为确保用户信息被存储,可以调用一次,但不阻塞导航
|
||||
getUserInfo().catch(err => console.error("Error fetching user info after login:", err));
|
||||
return next();
|
||||
}
|
||||
|
||||
// 方案3: 检查localStorage中是否有token (刷新后SessionStorage没有用户信息时)
|
||||
if (hasValidToken()) {
|
||||
try {
|
||||
await getUserInfo(); // 尝试获取用户信息,该函数会把用户信息存入SessionStorage
|
||||
return next(); // 获取成功,放行
|
||||
} catch (error) {
|
||||
// 获取失败 (token无效, 网络问题等)
|
||||
logoutUser(); // 清除所有凭证
|
||||
return next({
|
||||
path: '/backend/login',
|
||||
query: { redirect: to.fullPath }
|
||||
query: { redirect: to.fullPath, sessionExpired: 'true' }
|
||||
});
|
||||
}
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
|
||||
// 方案4: 如果以上条件都不满足,跳转登录页
|
||||
return next({
|
||||
path: '/backend/login',
|
||||
query: { redirect: to.fullPath }
|
||||
});
|
||||
});
|
||||
|
||||
export default router
|
||||
Reference in New Issue
Block a user