1.8 KiB
1.8 KiB
401未授权错误解决方案
问题原因
控制台出现401错误的原因:
- 未登录:用户还没有登录,但前端代码尝试获取用户信息和工作流列表
- Token过期:之前的token已过期或无效
- Token丢失:localStorage中的token被清除
已修复
1. 优化Home页面数据获取逻辑 ✅
修改了 Home.vue,确保:
- 只有在有token的情况下才尝试获取数据
- 如果获取用户信息失败,自动清除token并跳转到登录页
- 只有在成功获取用户信息后才获取工作流列表
2. 优化用户信息获取 ✅
修改了 user.ts 中的 fetchUser 函数:
- 如果401错误,自动清除token
- 更好的错误处理
解决方案
如果看到401错误:
-
检查是否已登录
- 如果未登录,请先登录
- 登录后token会自动保存
-
清除旧的token
- 打开浏览器控制台(F12)
- 在Console中输入:
localStorage.removeItem('token') - 刷新页面,重新登录
-
检查登录状态
- 打开浏览器控制台(F12)
- 在Console中输入:
localStorage.getItem('token') - 如果有值,说明token存在
- 如果为null,说明需要重新登录
正常流程
- 访问首页 → 如果没有token,自动跳转到登录页
- 登录 → 获取token并保存
- 自动跳转 → 跳转到首页
- 获取数据 → 使用token获取用户信息和工作流列表
测试步骤
-
清除token(如果需要):
localStorage.removeItem('token') -
刷新页面 → 应该自动跳转到登录页
-
登录 → 输入用户名和密码
-
检查 → 登录成功后应该:
- 自动跳转到首页
- 不再出现401错误
- 显示工作流列表
状态: ✅ 已修复 时间: 2024年