Rutas con metadatos
Clase 12 de 17 • Curso de Vue.js: Navegación con Vue Router
Contenido del curso
Ameth Ordoñez Erazo
student•
hace 4 años
Clase 12 de 17 • Curso de Vue.js: Navegación con Vue Router
Contenido del curso
Ameth Ordoñez Erazo
Carlos Rodríguez
Ameth Ordoñez Erazo
Carlos Rodríguez
Juan José Lockett
Diana Martinez
Geraldine Diaz
Diana Martinez
Se puede guardar la ruta donde estaban para que los dirija a la vista de inicio de sesión, y luego de iniciar los regrese a la página que querian ver inicialmente:
router.beforeEach((to, from) => { if (to.meta.requiresAuth) { // si esta logueado... return { path: '/login', // se guarda la dirección que querian visitar para regresarse luego de iniciar sesión query: { redirect: to.fullPath }, } } })
La validación debe hacerse de la siquiente manera:
if (to.meta?.roles && to.meta?.roles.includes('admin')) { return { path: 'session' }; }
Corrección:
Para retornar la ruta utilizando el path, se debe indicar con el '/':
return {path: '/session'}
Sino, puedes utilizar el nombre de la ruta, si está definido:
return {name: 'sesion'}
@amethgabriel Correcto, gracias por la corrección, aquí la documentación: Route Meta Fields
estoy un poco confundido... las validaciones no deberían implementarse en el backend? digo de repente todo este código es al final del día editable por el usuario o me equivoco?
Existen dos tipos de validaciones, las validaciones en el backend son para evitar que los usuarios den datos incorrectos, manipulados, inseguros, etc. Mientras que en frontend pueden ayudar a mejorar la experiencia del usuario, al validar la estructura y tipo de los mismos sin tener que llegar al submit del dato hacia el backend, ahorrando llamadas al mismo, además.
Un ejemplo es validar el rol de un usuario o si se encuentra logueado o no, para mostrar u ocultar sus datos y enlaces que solamente son relevantes según sus permisos, siendo algo de frontend, ui/ux, etc. Y muy aparte de las validaciones en backend que serían más para la seguridad y control de acceso.
Por otro lado, las validaciones de rutas pueden tomar ventaja de Server Side Rendering si se configuran correctamente, por lo que estas podrían ejecutarse en el backend.
Hola @diananerd y comunidad, quisiera saber cómo puedo desde la vista de lógin cambiar el valor de requiresAuth por false para que me deje entrar a la página de chats cuando me he "logueado", gracias
Hola, en este caso requiresAuth es un valor que le dice a la vista que solo puedes acceder si ya te has logueado, no sobre si ya te logueaste o no, para eso podrías utilizar almacenar el token de sesión en LocalStorage o utilizar una cookie y entonces basar tu condicional en eso.
Te recomiendo los cursos que continúan de este: Curso de Vue.js: Manejo del Estado con Vuex, Curso de Vue.js: Manejo del Estado con Pinia.
En esos dos cursos se habla más sobre esto y creo que justo se responde tu pregunta, además el proyecto es precisamente un ejemplo de eso.