soybean-admin icon indicating copy to clipboard operation
soybean-admin copied to clipboard

[Bug]: 页面长时间不操作,后台token失效返回401时,页面跳转login页失败会卡在loading页面状态

Open meteortent opened this issue 2 months ago • 10 comments

软件版本

1.3.14

运行环境

Windows (64)

运行架构

x86

重现步骤

前后端正常状态下登录,将页面停留在一个登录后页面,此时关闭后端服务并重启,使后端token清空为取不到状态,此时刷新前端页面,页面会在跳转登录页面时卡住,调试信息为 GetUserInfo返回401,Axios请求失败后尝试跳转登录页时卡住为loading页

期望的结果是什么?

可以正常返回到登录页面

实际的结果是什么?

卡住为loading页面

日志记录(可选)


补充说明(可选)

Image

meteortent avatar Oct 20 '25 14:10 meteortent

用的是静态路由还是动态路由?看着像路由没有返回,没找到 login 页面

Azir-11 avatar Oct 21 '25 07:10 Azir-11

用的静态路由,不是路由没找到,就是当刷新时组件装载过程中由于之前localStore中的客户登录信息都存在,正常需要服务器返回结果,但服务端因为token过期或已经不存在所以返回401后,客户端在error处理中要去跳转,但此时应用还在始化中,所以卡了

卡住后,如果再次刷新,就可以正常跳转到login页了,因为这时main执行完后应用已经初始化完成,路由组件可以正常使用了,就没问题了

meteortent avatar Oct 22 '25 05:10 meteortent

用的静态路由,不是路由没找到,就是当刷新时组件装载过程中由于之前localStore中的客户登录信息都存在,正常需要服务器返回结果,但服务端因为token过期或已经不存在所以返回401后,客户端在error处理中要去跳转,但此时应用还在始化中,所以卡了

卡住后,如果再次刷新,就可以正常跳转到login页了,因为这时main执行完后应用已经初始化完成,路由组件可以正常使用了,就没问题了

感谢反馈,我抽空再尝试复现一下

Azir-11 avatar Oct 22 '25 05:10 Azir-11

请问这个问题处理好了吗?或者有什么解决办法或解决思路吗?

meteortent avatar Oct 31 '25 10:10 meteortent

提供个复现问题的仓库代码

honghuangdc avatar Nov 02 '25 05:11 honghuangdc

我也遇到这个问题, 我这是必现, 不过我在项目中改了不少东西, 我一直以为是我自己改出来的

litecy avatar Nov 07 '25 08:11 litecy

不需要复现问题的代码,前端代码不用动,想重现问题就把后端的token清掉,让后端返回401,这样前端刷新页面初始化vue时就可以复现,问题的原因就在于初始化没有完成时axios中error处理401要router跳转时,这时router还没有完成

用的静态路由,不是路由没找到,就是当刷新时组件装载过程中由于之前localStore中的客户登录信息都存在,正常需要服务器返回结果,但服务端因为token过期或已经不存在所以返回401后,客户端在error处理中要去跳转,但此时应用还在始化中,所以卡了

卡住后,如果再次刷新,就可以正常跳转到login页了,因为这时main执行完后应用已经初始化完成,路由组件可以正常使用了,就没问题了

meteortent avatar Nov 12 '25 14:11 meteortent

我也遇到这个问题, 我这是必现, 不过我在项目中改了不少东西, 我一直以为是我自己改出来的

@litecy 简单的,你把 main.ts 里的 await setupRouter(app); 套个 try-catch就可以了

meteortent avatar Nov 12 '25 15:11 meteortent

我也碰到这个问题了,我在axios处理401之后手动加了一个location.reload()

yuwenOvO avatar Nov 26 '25 03:11 yuwenOvO

setupRouter

不太行, try catch 之后还是一样的问题

litecy avatar Dec 11 '25 07:12 litecy