vue 判断是否登录,未登录跳转到登录页

Posted lalalagq

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 判断是否登录,未登录跳转到登录页相关的知识,希望对你有一定的参考价值。

网页一进入判断是否登录,未登录跳转到登录页面

router.js

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld,
      meta: {
        title: '首页',
        requiresAuth: true // 是否需要判断是否登录
      }
    },
    {
      path: '/login',
      name: 'login',
      component: login,
      meta: {
        title: 'login'
      }
    }
  ]
})

main.js

router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.meta.title
  }
  // 判断该路由是否需要登录权限
  if (to.matched.some(record => record.meta.requiresAuth)) {
    if (to.name === 'login') {
      next()
    } else if (localStorage.getItem('token')) {
      // 访问服务器缓存数据,判断当前token是否失效
      Vue.http.get("http:xxxx/Login/UserIsLogin?token="+localStorage.getItem('token')+"&url="+to.name,{withCredentials: true}).then(response => response.json()).then(num => {
            // console.log('是否登录',num);
            if(num.code==1001){
             next();
            } else{
             alert('您的token已超时,请重新登录');
             next('/Login');
          }
       })
    } else {
      next('/Login')
    }
  } else {
    next()
  }
})

以上是关于vue 判断是否登录,未登录跳转到登录页的主要内容,如果未能解决你的问题,请参考以下文章

vue项目实现登录携带token

vue 根据接口返回的状态码判断用户登录状态并跳转登录页

vue路由跳转时判断用户是否登录功能

Five——tornado操作之用户登录&使用pycket库实现用户认证功能(通过判断能否获取到session来判断用户是否登录—未登录则不管访问哪个界面都自动跳转到登录页面))

js判断是不是登录并跳转页面

VUE开发SPA之微信授权登录