Estoy haciendo una pequeña practica con Vue
y Firebase
, ya he logrado crear usuarios y configurar bien Firebase
pero tengo un problema a la hora de restringir rutas con VueRouter
, con lo que he leído debería bastar con la propiedad requiresAuth
para restringirla si no hay usuario logueado, pero no funciona de esta forma:
{
path: '/home',
name: 'Home',
component: Home,
meta: { requiresAuth: true }
}
Pero la ruta sigue siendo accesible a pesar de que no haya iniciado sesión ningún usuario. ¿Hace falta alguna configuración extra?
Mi archivo de rutas es este:
Vue.use(Router)
export default new Router({
routes: [
{
path: '*',
redirect: '/'
},
{
path: '/',
name: 'Index',
component: Index
},
{
path: '/register',
name: 'Register',
component: Register
},
{
path: '/home',
name: 'Home',
component: Home,
meta: { requiresAuth: true }
}
]
})
Router.beforeEach((to, from, next) => {
let usuarioActivo = firebase.auth().currentUser;
let requiresAuth = to.matched.some(record => record.meta.requiresAuth);
if (requiresAuth && !usuarioActivo) next('index')
else if (!requiresAuth && usuarioActivo) next('home')
else next()
})
Al agregar el beforeEach y preguntar si la ruta requiere autorizacion me tira este error: