错误：通过导航守卫从“/login”转到“/home”时重定向。 Vue-router 和 firebase-authentication

Posted 2023-02-22

【中文标题】错误：通过导航守卫从“/login”转到“/home”时重定向。 Vue-router 和 firebase-authentication

【英文标题】：Error: Redirected when going from "/login" to "/home" via a navigation guard. Vue-router and firebase-authentication

【发布时间】：2021-07-01 21:53:11

【问题描述】：

我有一个带有 Vue.js 和 Firebase 的应用程序，我正在使用 firebase 身份验证登录我的应用程序，但我想创建一个 beforeEach 方法，以便我可以使用 firebase 身份验证作品添加验证。我想比较displayName 值以让用户登录，但是当我使用else if 时出现错误并且不起作用。

我的路由器文件

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import firebase from 'firebase/app';
import 'firebase/auth';

Vue.use(VueRouter)

const routes = [
  
    path: '*',
    redirect: '/login'
  ,
  
    path:'/',
    redirect: '/login'
  ,
  
    path: '/home',
    name: 'Home',
    component: Home,
    meta: 
      requiresAuth: true
    
  ,
  
    path: '/quotations',
    name: 'Quotations',
    component: () => import(/* webpackChunkName: "quotations" */ '../views/Quotations.vue'),
    meta: 
      requiresAuth: true
    
  ,
  
    path: '/login',
    name: 'Login',
    component: () => import(/* webpackChunkName: "login" */ '../views/Login.vue')
  ,
  
    path: '/sign-up',
    name: 'SignUp',
    component: () => import(/* webpackChunkName: "login" */ '../views/SignUp.vue')
  
]

const router = new VueRouter(
  mode: 'history',
  base: process.env.BASE_URL,
  routes
)

router.beforeEach((to, from, next) =>
  const currentUser = firebase.auth().currentUser;
  const requiresAuth = to.matched.some(record => record.meta.requiresAuth);

  if(requiresAuth && !currentUser )next('login');
  else if(!requiresAuth && currentUser) next('home');
  // I want to compare if the user thats is loggin has the displayName === "3" to enter in my app 
  else if(requiresAuth && currentUser && currentUser.displayName != "3")next('login');
  
  else next();
);

在else if(requiresAuth && currentUser && currentUser.displayName != "3")next('login'); 行中出现错误，但我不知道如何解决。

【问题讨论】：

究竟是什么错误？您在上面的问题标题中提出的内容听起来不是很错误-y

@Phil 我想阻止登录if displayName === "3" 但出现错误并且不起作用。

【参考方案1】：

您的第一个else if 条件总是在您的第二个else if 之前考虑并满足，因为它的指定程度低于您的第二个。所以第二个else if 将无法到达。你应该切换那些。

【讨论】：

错误继续，我切换了else if，他回到家回来登录显示我的应用程序并在控制台中继续同样的错误