如何解决Vue路由器安全吗?
我正在用vue开发Web,我意识到如果将其放在控制台中
document.getElementById('app').__vue__.$router.push("some_route")
尽管我在 beforeEach 导航保护(requireAuth)中声明了元,但它仍然可以工作。 我需要进行一些随机用户无法访问的路由,在烧瓶中制成的api中,我返回一个令牌和一个角色,如果我尝试通过任何导航器访问地址栏,但通过控制台访问时,此方法就可以正常工作不会,路由器不进行身份验证即可推送路由。
router.beforeEach(async (to,from,next) => {
if(to.matched.some(record => record.meta.requiresAuth)){
let user = JSON.parse(localStorage.getItem('user')) //user is a json with a jwt token
if (user && user.token){
await user_service.isLogged(to.path).then(response => {
//wait for a response from the server if the token is valid
switch (response.status){
case 200:
next()
break;
case 401:
next({path: '/login'})
break;
case 403:
next({path: '/403'})
break;
}
})
}else{
next({path: '/login'})
}
}
next()
})
感谢您的任何反馈。谢谢!
解决方法
没有什么可以阻止最后一个next()
的运行,这会使整个导航守护程序变得多余。
要么将其包装在else
块中,例如
if(to.matched.some(record => record.meta.requiresAuth)) {
// your code
} else {
next()
}
或更改您的代码以在适当的位置退出(通过return
)
router.beforeEach(async (to,from,next) => {
if(to.matched.some(record => record.meta.requiresAuth)){
let user = JSON.parse(localStorage.getItem('user'))
if (user && user.token){
await user_service.isLogged(to.path).then(response => {
//wait for a response from the server if the token is valid
switch (response.status){
case 200:
return next()
case 403:
return next({path: '/403'})
case 401:
default:
return next({path: '/login'})
}
})
} else {
return next({path: '/login'})
}
}
next()
})
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。