码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2018-11-02 21:50:03      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:==   服务器   .json   port   component   on()   router   登录跳转   com   

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

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 判断是否登录,未登录跳转到登录页

标签:==   服务器   .json   port   component   on()   router   登录跳转   com   

原文地址:https://www.cnblogs.com/lalalagq/p/9898202.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!