Vue实现登录保存token并校验实现保存登录状态

淩亂°似流年 2024-04-06 15:28 125阅读 0赞

#### 文章目录 ####

*  一、登录vue
 *  二、路由index

--------------------

## 一、登录vue ##

## 二、路由index ##

// 导航守卫
    router.beforeEach((to, from, next) => {
        
      const token = localStorage.getItem('token');
      const outerPaths = ['/homePage']; // 当前 path 不需要登录也可以进入系统，但是只能操作当前页面
      if (!token && !outerPaths.includes(to.path)) {
        
        next('/homePage');
      } else {
        
        // if (to.path == "/auth") {
        
        //   document.title = to.meta.title  // 进入这个页面会被更改页面标题
        // } else document.title = 'CPS流量变现后台管理系统'
        next();
      }
    });

![在这里插入图片描述][212c1cf7239e4ba2a3b6871ad3e8fd3a.png]

*  坚持不懈，努力奋斗，心之所向必定成真。
 *  拥有激情与决心，创造无限可能的未来。
 *  放飞心灵，勇往直前，追逐梦想的星辰大海。
 *  不怕失败，享受过程，每一次尝试都是一种进步。
 *  集中注意力，努力前行，不要停下，直到成功只是习惯。

[212c1cf7239e4ba2a3b6871ad3e8fd3a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/06/1195dc946ec7406798560084d1ac350f.png