Vue 路由守卫死循环?

2020-09-02 · 周三开心阵雨

今天主要把那个 Vue 后台的 Token 过期后无法跳回登录的问题给完善了,对路由守卫进行优化,通过后端输出过期时间,在前台切换页面的时候进行检测就可以了。

router.beforeEach((to, from, next) => {
  if(to.meta.title) {
    document.title = to.meta.title + " - 管理后台";
  }

  if(to.name !== "Login" && !isLogin()){
    console.error("未登录");
    next("/login");
  }
  else{
    next();
  }
});

而我之前的写法和文档不同,就出现了死循环。为什么呢?

if(to.name === "Login" && isLogin){
    // 当时我只知道 next 是不会跳转的
    // 在 Login 页面确实不应该跳转
    // 因为是没登录才跳,所以就用了“已登录”作为判断条件了
    next();
}
else{
    next("/login");
}

// 再之前的,没有登录,指向 Login 就允许跳转?
if(!sessionStorage.getItem("sign")) {
  if(to.path == "/login") {
    next();
  }
  // 不是 Login 怎么处理?直接就不显示了!
}
// 结果最后加了这个“才能用”
next();

假设我们访问的地址是“Booking”,那么第一个条件肯定无法通过,指向“Login”。但是即便跳过去了,但仍然是“未登录”状态,于是就会出现循环跳转“Login”的情况了... 而再之前的写法就毫无疑问了,完全错误,当时自己估计写的都晕了 😷

是不是感觉我明明很菜,却还想逞强不看文档?😭 确实如此。我认为现在的前端技术确实变迁的太快,库只会越来越多,你也不可能全部都能学会。万一一个库不更新了,遇到 Bug 修不成,重做又是个大工程!所以还是得会最基础最原始的技术,也正是这样,我自己的项目才会一直坚持着自己写组件...

晚上和老王开吃鸡的时候,他的运气意外的强。在皮卡多的大仓出现了三台饮料机,而他却接连不断的狂出 8 瓶饮料,以至于他的背包已经装下了高达 60+ 的惊人数量...

09.02-疯狂的饮料.jpg
Go **** Yourself (Remix)

Go **** Yourself (Remix)

Teddy Specter
Paul

Paul

特立独行的一只前端菜狗。这篇日记编写大概耗时了 0 分钟,内容均为个人原创,并采用 CC BY-NC-SA 4.0 授权协议,转载请注明来源,谢谢!如本站内容对你有所帮助的话,不妨 捐助支持 一下?

近期评论

鲍小螺: 前辈多多指教!ahu: 后生可畏寻梦xunm: 真不错,板子很好看。timochan: 太惨了( ,更新暴毙,如果恢复没成功,数据也 dump 不出来鲍小螺: 在这部分对话中,广树和保罗继续讨论生活的不同方面。保罗提到了技术更新和国内的优秀 IT 技术。广树解释了在国内积累的经验如何在日本产生穿越的感觉,并表达了对于日本生活节奏的喜爱。他还提到了医疗水平的差异和对于生活方式的感受。保罗表示,通过动漫和现实的对比,艺术来源于现实,日本生活的确有着独特之处。他们讨论了国内的生活节奏和就医等方面的压力,以及个人选择的自由。最后,他们也谈到了不结婚不买房的选择和对于房价的困扰。鲍小螺: 该对话进一步讨论了房地产和税收的问题。保罗提到了国内的房地产税和增值税以及日本的固定资产税。广树解释了日本房地产税的收取方式,以及房产税对于国内房产的影响。他认为,与国内相比,日本的房子质量和服务更好。保罗提出疑问,为什么自己拥有的地也要交税。广树解释了类似增值税的原理,并指出在日本拥有房产是稳定安全的。最后,保罗表示从广树的角度来看,情况确实是如此。鲍小螺: 这篇文章的聊天记录也尝试过用 GPT 总结,结果并不是太好,不知道是不是 Prompt 的问题,实际出来的内容过于简练了,于是又耗费了半小时写完,呼~
奇趣音乐盒技术源于 Kico Player
Emmm,这里是歌词君