Files
art-design/MENU_PERMISSION_FIX.md
2025-07-21 11:16:16 +08:00

77 lines
2.7 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 菜单权限控制问题修复方案
## 问题描述
在后端控制模式下,当普通用户登录后再退出登录管理员时,管理员特有的菜单会出现404错误。
## 问题原因
1. **路由注册状态未正确重置**:`isRouteRegistered` 标志位在用户切换时没有正确重置
2. **动态路由清理不完整**:`resetRouterState` 函数只清理了带有 `meta.dynamic` 标记的路由
3. **工作台标签页验证时机问题**:`validateWorktabs` 在路由重新注册后执行,但可能没有正确清理无效的标签页
4. **用户信息变化检测缺失**:没有检测用户切换事件,导致路由状态没有及时更新
## 修复方案
### 1. 改进路由状态重置 (`src/router/guards/beforeEach.ts`)
- 修改 `resetRouterState` 函数,清理所有动态注册的路由(不仅仅是带有dynamic标记的)
- 添加工作台标签页的清理
- 使用菜单store的 `clearMenuList` 方法
### 2. 添加用户切换检测 (`src/router/guards/beforeEach.ts`)
- 在 `handleRouteGuard` 函数中添加用户信息变化检测
- 使用 `sessionStorage` 缓存用户信息,检测用户切换
- 当检测到用户信息变化时,强制重置路由状态
### 3. 改进菜单API (`src/api/menuApi.ts`)
- 添加用户登录状态验证
- 改进菜单数据验证逻辑
- 添加更详细的错误处理和日志
### 4. 完善用户登出逻辑 (`src/store/modules/user.ts`)
- 在 `logOut` 方法中添加更完整的状态清理
- 清理用户信息缓存
- 确保工作台标签页被正确清理
### 5. 增强菜单Store (`src/store/modules/menu.ts`)
- 添加 `clearMenuList` 方法用于清理菜单数据
- 提供更完整的状态管理
### 6. 改进错误处理 (`src/router/guards/beforeEach.ts`)
- 修改 `handleMenuError` 函数,确保在菜单处理失败时正确清理所有状态
- 添加更详细的状态清理逻辑
## 测试工具
创建了 `src/utils/menuPermissionTest.ts` 测试工具,包含:
- `testMenuPermissionSwitch()`: 测试菜单权限切换的正确性
- `simulateUserSwitch()`: 模拟用户切换过程
## 使用方法
1. 在浏览器控制台中调用 `testMenuPermissionSwitch()` 检查当前状态
2. 在用户切换后调用 `simulateUserSwitch()` 模拟切换过程
3. 观察控制台输出,确认路由和菜单状态正确
## 预期效果
修复后,当用户切换时:
1. 所有动态路由会被正确清理
2. 菜单数据会被重新加载
3. 工作台标签页会被验证和清理
4. 不会出现404错误
5. 用户权限会正确应用
## 注意事项
- 确保后端返回的菜单数据与用户权限匹配
- 在开发环境中可以使用测试工具验证修复效果
- 建议在生产环境中添加更多的日志记录用于问题排查