fix(auth): 修复退出登录时token无效的问题

- 优化退出登录流程,先清除本地缓存再调用后端接口
- 确保即使后端接口失败也能正常清理前端状态
- 添加fetchLogout接口调用,保证前后端状态同步
- 修复退出登录时序问题,避免token状态不一致
This commit is contained in:
Leo 2025-07-06 22:07:38 +08:00
parent 87220caff5
commit d6f3cfe25c

View File

@ -1,5 +1,5 @@
import { router } from '@/router'
import { fetchLogin, fetchLoginUserInfo } from '@/service/api/auth'
import { fetchLogin, fetchLoginUserInfo, fetchLogout } from '@/service/api/auth'
import { local } from '@/utils'
import { useRouteStore } from './router'
import { useTabStore } from './tab'
@ -25,16 +25,27 @@ export const useAuthStore = defineStore('auth-store', {
/* 登录退出,重置用户信息等 */
async logout() {
const route = unref(router.currentRoute)
// 清除本地缓存
// 先清除本地缓存立即使token失效
this.clearAuthStorage()
// 重置当前存储库
this.$reset()
// 清空路由、菜单等数据
const routeStore = useRouteStore()
routeStore.resetRouteStore()
// 清空标签栏数据
const tabStore = useTabStore()
tabStore.clearAllTabs()
// 重置当前存储库
this.$reset()
// 最后调用后端退出登录接口
try {
await fetchLogout()
}
catch (error) {
// 后端接口调用失败不影响前端清理
console.warn('后端退出登录接口调用失败:', error)
}
// 重定向到登录页
if (route.meta.requiresAuth) {
router.push({
@ -67,9 +78,13 @@ export const useAuthStore = defineStore('auth-store', {
if (!userInfoResult.isSuccess)
return
// 处理登录信息
// 处理登录信息 - 转换后端返回的数据结构
const userInfo = {
...userInfoResult.data,
id: userInfoResult.data.loginUser.userId,
userId: userInfoResult.data.loginUser.userId,
userName: userInfoResult.data.loginUser.userName,
avatar: userInfoResult.data.loginUser.avatar,
role: userInfoResult.data.roles,
accessToken: data.tokenValue,
refreshToken: data.tokenValue, // 如果后端没有单独的refreshToken暂时使用相同值
}
@ -100,5 +115,15 @@ export const useAuthStore = defineStore('auth-store', {
path: query.redirect || '/',
})
},
/* 更新用户信息 */
updateUserInfo(updates: Partial<Api.Login.Info>) {
if (this.userInfo) {
// 更新内存中的用户信息
this.userInfo = { ...this.userInfo, ...updates }
// 更新本地存储
local.set('userInfo', this.userInfo)
}
},
},
})