实时检查用户是否登录,思路是这样的,在main.js中调用路由钩子beforeEach,后端可以提供一个是否登录的钩子,每次路由验证是否登录,成功则next,失败就跳转到登录页。
main.js代码如下:
router.beforeEach((to,from,next)=>{
if(to.meta.requireAuth){
Vue.http.get('http://60.205.183.23:8080/common/check_login').then(
function(res){
if(res.body.code==1){
// alert('1')
next();}
else {
!
next({path:'/'})
}
},
function(err){
// alert('2')
next({path:'/'});
});
}
else
next();
})
路由配置如下:
export default new Router({
mode:'history',
routes: [
{
path:'/MyHeader',
component:MyHeader,
meta:{requireAuth:true},
children:[
{
path: 'viewManage',
component: viewManage,
meta:{requireAuth:true},
},
{
path: 'saleManage',
component: saleManage,
meta:{requireAuth:true},
},
{
path: 'accountManage',
component: accountManage,
meta:{requireAuth:true},
}]
},
{
path: '/', //登录路径
name: 'login',
component: login,
meta:{requireAuth:true},
},
]
})
当未登录时,查看network,不断弹出3(测试用的alert(3)),不断地请求check_login接口,路径并不会跳转到'/',但是next({path:'/'})没错呀,为什么会出现这样的情况呢,求解答,谢谢!
是不是因为 / 也是需要登陆的,然后未登陆时也要跳转到它,就是一个无穷递归了。