Tengo un enrutador vue3 definido con las siguientes rutas

 const routes = [ { path: "/", name: "home", component: HomeView, }, { path: "/about", name: "about", component: () => import(/* webpackChunkName: "about" */ "../views/AboutView.vue"), }, { path: "/gallery", name: "gallery", component: () => import(/* webpackChunkName: "gallery" */ "../views/GalleryView.vue"), }, { path: "/cms", name: "cms", component: () => import(/* webpackChunkName: "cms" */ "../views/CmsView.vue"), }, { path: "/login", name: "login", component: () => import(/* webpackChunkName: "cms" */ "../components/Login/LoginPage.vue"), }, ];

Estoy tratando de implementar una función de inicio de sesión de Google Auth en la que solo se puede acceder a la ruta /cms si se ha iniciado sesión en una cuenta específica. Tengo un booleano en la tienda llamado login que se cambiará a verdadero en el componente. Como se muestra

 <script setup> import { decodeCredential, googleLogout } from "vue3-google-login"; import store from "@/store/index"; import router from "@/router/index"; const callback = (response) => { const userData = decodeCredential(response.credential); if (userData.email === "my_email") { store.state.loggedIn = true; router.push({ path: "/cms" }); } else { store.state.loggedIn = false; googleLogout(); } }; </script>

En el enrutador, estoy haciendo un beforeEach para verificar a qué página enrutar en función de dónde proviene un usuario y si un usuario específico inició sesión como se muestra.

 router.beforeEach(async (to, from, next) => { // If not logged in and trying to access cms if (!store.state.loggedIn && to.name === "cms") { return next({ name: "login" }); } // If logged in and trying to access cms after login else if (store.state.loggedIn && to.name === "cms" && from.name === "login") { console.log("test"); return next({ name: "cms" }); } // Else just route to next page else { return next(); } });

Todo parece funcionar, excepto cuando el usuario correcto inicia sesión. Un error no detectado (en promesa): se lanza una redirección infinita en la protección de navegación y la página no se redirige a /cms en lugar de elegir permanecer en la página /login .