vue router router.js 关于token 本地存储配置

// 挂载路由导航守卫
router.beforeEach((to, from, next) => {
  // to 将要访问的路径
  // from 代表从哪个路径跳转而来
  // next 是一个函数，表示放行
  //     next()  放行    next('/login')  强制跳转

  if (to.path === '/login') return next()
  // 获取token
  const tokenStr = window.sessionStorage.getItem('token')
  if (!tokenStr) return next('/login')
  next()
})

export default router

一、检查当前路由是否是登录页面（'/login'）

       如果当前路由的路径是/login ， 则直接调用next () 继续执行路由跳转。

二、检查本地存储中的token:

        通过window.sessionStorage.getItem('token') 从会话存储（sessionStorage）中获取名为token 的值。

        如果没有获取token（即tokenStr 为undefined 或者空字符串 ），则重定向到登录页面（‘/login’）,这通过是为了防止未登录的用户访问需要认证的页面。

三、放行路由

     如果已经存在token ，说明用户已将登录，此时再次调用next ()允许用户访问目标路由。

四、导出router

      使用export  default router 将这个配置好的router 对象导出，以便vue应用的其他部分使用。