导航守卫 beforeEach 无限循环

Question

尝试使用导航守卫，但next('/auth/login')给出无限循环：

router.beforeEach((to, from, next) => {
  auth.validate().then((valid) => {
    if (!valid) {
      next('/auth/login')
    } else {
      next()
    }
  })
})

路由器定义：

const router = new Router({
  routes: [
    {
      name: 'login',
      path: '/auth/login',
      component: login
    }
})

Answer 1

在我看来，当您的身份验证无效时，您的路由器会将您发送到/auth/login该页面，并在该页面上再次发送。我在我的应用程序中以不同的方式处理这个问题，但是通过您的代码，您可以使用路线中的对象添加一种方法来检查页面的来源from。

您需要一些东西来检查当前路由是否/auth/login然后忽略不重定向。

例子：

 if (!valid && from.path !== '/auth/login') {}

这不会重定向回 /auth/login，因为您来自该页面。