iframe框架token失效重新登陆问题

在登录信息过期之后,或者也就是token过期后,要登出,跳转到登录页面重新登录来获取token等信息。

这时如果你用的是iframe框架的话,就会出现登录界面是嵌套在框架里面的情况,或者出现下图所示报错情况。

出现这种情况的原因是:现在登出的只是内层,要一层一层直到最外层登出才是正确的。

在我的代码中,我尝试了一下debugger,发现token失效后,当刷新整体页面时也是走到了这一步

else { location.href = `${ this.$config.ssoUrl }/oauth/authorize?response_type=code&client_id=${ this.$config.ssoClientId }&redirect_uri=${encodeURIComponent(redirect_uri)}&scope=all&state=`; }。

而token失效在页面内时也是走到了这一步,也就是说明这里跳转登录页是没有问题的,但页面仍然报错,这说明现在登出的只是内层,要一层一层直到最外层登出才是正确的。

这个问题解决方法也很简单,只需要在登录界面加js代码判断就可以。

//判断一下当前是不是最顶层,如果不是,则做一下顶层页面重定向
        if (window != top) {
            top.location.href = location.href;
        }

这段代码首先检查当前页面是否在最顶层窗口中,如果不是,则通过顶层页面的重定向将当前页面置于最顶层。然后,它继续执行你的登录逻辑,就像之前的代码一样。

请确保将这段代码放在Vue组件的mounted生命周期钩子内,以便在页面加载完成后执行。

这样,当Token失效时,页面会被重定向到最顶层,然后执行你的登录逻辑,确保了整个应用程序的正确性。

问题2:

在框架里,内层调用接口报错401,即使使用axios请求拦截器也拿不到状态码401,拿到的是“网络错误",因为顶层可以拿到,内部拿不到。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值