Angular Login Authentication - JWT Express Mysql

Este es el primer vídeo de la sección Angular Login Authentication, donde usaremos JWT para validar información y rutas desde el backend y frontend.
Si te gustó el vídeo por favor suscríbete y comenta algún tema que te gustaría ver a futuro en el canal.
Mi facebook personal: faceboook.com/fariid.davila.9/
Documentación oficial JWT: jwt.io/introduction/
Dale estrella a los repositorios:
github.com/StilDavila/ExpressJWT
github.com/StilDavila/Angular...
Algunos comandos usados en el vídeo:
npm install --save @auth0/angular-jwt
npm install --save @auth0/angular-jwt
0:00 Introducción
01:03 ¿Qué es login authentication con JWT?
05:00 Servidor de express y mysql
31:57 Creacion de proyecto Angular

Пікірлер: 74

  • @frankkismann1043
    @frankkismann10432 жыл бұрын

    Estimado, analicé su vídeo por más de 5 horas e integré con el sistema que estoy desarrollando. Le agradezco mucho desde Chile y no deje de compartir su conocimiento, porque en mi caso este vídeo fue de gran pero gran ayuda para lo que estoy desarrollando. Muchas gracias.

  • @edriball121
    @edriball121 Жыл бұрын

    Honestamente, tenia mucho temor meter JWT en mi proyecto de grado, queria irme por la facil y viendo tu video, me di cuenta lo facil que es usar JWT, pero es gracias a ti, vi varios videos y quedaba mas confundido, en 2023 este video la sigue rompiendo, muchas gracias, funciona al 10 de 10; me quedas debiendo el video de los frameworks que recomiendas para front-end angular, ya que soy de los que usa bootstrap para todo! mil gracias, un crack!

  • @Lechuga194
    @Lechuga19411 ай бұрын

    Que grande, gracias por el video! :D

  • @23AJFA
    @23AJFA Жыл бұрын

    Hermano eres una Crack. mis felicitaciones. me enseñaste mucho en este video. Ya me suscribí y seguiré aprendiendo todo lo que pueda de ti. Eres un excelente profesor. y desarrollador, Felicitaciones de verdad. 👏👏👏👏👏👏👏👏👏

  • @gonzaloquiroga7761
    @gonzaloquiroga77616 ай бұрын

    Mil gracias Maestro.

  • @miguelsarmiento9268
    @miguelsarmiento92683 ай бұрын

    tuve que volver al pasado para hacer algo como esto gracias.

  • @vvaldesss
    @vvaldesss Жыл бұрын

    Muchas gracias por el curso y dar luz sobre el uso de los tokens en bakend y frontend, me ha servido de mucho, saludos

  • @nelson3391
    @nelson33912 жыл бұрын

    Excelente Vídeo. De lo mejor que he visto. Es aplicable directamente. Muchas Gracias!

  • @stevenpacheco3894
    @stevenpacheco38943 жыл бұрын

    Excelente video! Super bien detallado. Gracias.

  • @jesussg792
    @jesussg7922 жыл бұрын

    Me sirvió mucho, agradezco el tutorial, muy bien explicado.

  • @joaopaulorodriguessoares5877
    @joaopaulorodriguessoares58773 жыл бұрын

    excelente video, muy bien explicado. me ayudó mucho en mis estudios. excelente

  • @ediguerrero4331
    @ediguerrero43313 жыл бұрын

    Todo super explicado , excelente

  • @irvinggabrielrangelparedes6287
    @irvinggabrielrangelparedes62872 жыл бұрын

    muy bien explicado , me sirvio mucho gracias

  • @mavamv3737
    @mavamv3737 Жыл бұрын

    Hola!! muchas gracias!! que video tan completo

  • @maopuerta3430
    @maopuerta34303 жыл бұрын

    excelente video, muy bien explicado. Saludos. Nota: Ojala pudieramos ver algo de pruebas unitarias con Jest para Angular

  • @juanmanuelbarcazasepulveda6649
    @juanmanuelbarcazasepulveda66492 жыл бұрын

    Muy buen aporte..Gracias

  • @3djdavid
    @3djdavid2 жыл бұрын

    Muchas gracias!, tremendo video!

  • @Magistrado1914
    @Magistrado1914 Жыл бұрын

    Excelente vìdeo Visto en 26/08/2022

  • @141Brayan
    @141Brayan Жыл бұрын

    Excelente tutorial... Funcionó excelente

  • @antonioluduenabereziuk7416
    @antonioluduenabereziuk74162 жыл бұрын

    Excelente aporte , gracias ,

  • @fabianbustos5188
    @fabianbustos5188 Жыл бұрын

    Excelente explicación. Like + Suscrito + stars en los repos 👍

  • @sergiogomez602
    @sergiogomez6023 жыл бұрын

    Gracias, si consigo un trabajo es gracias a este video :v

  • @aldobauvel

    @aldobauvel

    2 жыл бұрын

    consegiste?

  • @MangoPrograming
    @MangoPrograming3 жыл бұрын

    muy buen video

  • @economix1817
    @economix1817 Жыл бұрын

    Muy buen video, me gustaria saber si tiene algun video de registros, como tipo CRUD en Angular?

  • @user-ge4zi7nf4b
    @user-ge4zi7nf4b5 ай бұрын

    Muchas gracias por compartir. 20:58 Creo que no es buena idea enviar todos los datos de autenticación para formar la firma del token (ya que la variable data está conteniendo la contraseña y no debería enviarse ni siquiera aunque estuviera encriptada y tampoco debería mandarse el correo)

  • @oscareduardorodriguezcastr8517
    @oscareduardorodriguezcastr85172 жыл бұрын

    para tipar user tendria que crear un models en donde encapsule el objeto? ayuda por favor

  • @ZonikGraF
    @ZonikGraF2 жыл бұрын

    Gracias Crack.

  • @davidvillarreal5256

    @davidvillarreal5256

    2 жыл бұрын

    Hola bro, una duda, cuando trato de obtener token del local storage me genera error en la línea this.jwtHelper.isTokenExpired(token) subraya token diciendo que no se puede un valor null. sabes la solución?

  • @nelsonfuentes8091
    @nelsonfuentes80912 жыл бұрын

    Stil, gracias por compartir tus conocimientos, podrías explicar como después de un login te muestre el menú, gracias

  • @joelant03

    @joelant03

    Жыл бұрын

    Si lo hace en el minuto 57:41

  • @martin40016
    @martin40016 Жыл бұрын

    que pasa si modifico el token añadiendo que soy admin en role, no seria una falla de seguridad ingresar el rol en el jwt?

  • @byrontorres09
    @byrontorres09 Жыл бұрын

    Buena tarde, todo me sale bien, ahora quiero dejar mi api en el hosting, como lo hago?. Muchas gracias.

  • @Joeron79
    @Joeron7910 ай бұрын

    Excelente. Necesito saber como expirar el token, luego cierra el logout automático en 15 minutos? Cómo?

  • @frank1785
    @frank17855 ай бұрын

    Hola que versión de Angular usaste ?

  • @edriball121
    @edriball121 Жыл бұрын

    Amigo, como puedo controlar que componentes puede o no ver un usuario especifico?

  • @sayayin1035
    @sayayin1035 Жыл бұрын

    PREGUNTA SI AGREGO DIGAMOS SI PONGO UN TOKEN CON UNA FIRMA LA LIBRERIA QUE PUSISTE LA DETECTA COMO NO VALIDO ? ES QUE DIGAMOS QUE QUIERO QUE SI PONGO UN TOKEN ESCRITO A MANO DIGAMOS EN EL LOCAL STORAGE ESTE ME LO DETECTE COMO UN TOKEN NO VALIDO O BUENO NO SE COMO PODRIA HACER ESO ?? POR CIERTO ESTOY USANDO UN API CON REFRESH TOKEN MUCHAS GRACIAS DE ANTEMANO

  • @ciscocapita
    @ciscocapita2 жыл бұрын

    Estoy teniendo um error en la variable res no lo reconece como lo puedo resolver

  • @ricardobh97
    @ricardobh973 жыл бұрын

    me gusto mucho suerte, Express con TS funciona ?

  • @KevinDavilaDev

    @KevinDavilaDev

    3 жыл бұрын

    Hola, por defecto sólo funciona con js. Podrías utilizar ts pero necesitas una configuración específica a nivel del proyecto. Puedes revisar este artículo javifont.medium.com/c%C3%B3mo-y-por-qu%C3%A9-deber%C3%ADas-usar-typescript-con-node-y-express-14fc9c1d82eb donde hacen un proyecto sencillo con Express y TS. Quizá esté subiendo un vídeo donde hagamos el mismo servidor del vídeo pero usando TS :)

  • @vilmaelizabethaldanaperez1708
    @vilmaelizabethaldanaperez17082 жыл бұрын

    haga mas videos !

  • @luiszabalaga3816
    @luiszabalaga38162 жыл бұрын

    Hola, alguien mas tiene problemas en el role.guards con la linea: const { userName, roleId } = decode(token); "La propiedad 'roleId' no existe en el tipo '{}'.ts(2339)" , si lo resolvieron me comentan por favor

  • @juanfernandohurtadoguzman8980

    @juanfernandohurtadoguzman8980

    Жыл бұрын

    hola lo encontré, tarde pero lo hice

  • @arturovazqueza.8264
    @arturovazqueza.8264 Жыл бұрын

    @Kevin Davila , gracias por el aporte esta genial. Solo tengo una duda, al obtener el token y ponerlo en cualquier visor de token en linea, este me permite ver los datos que van encriptados, a que se debe esto, en teoria si no conoce el *secretOrPrivateKey* no deberia ser posible decodificarlo, alguien tiene alguna idea?

  • @isaacorregor

    @isaacorregor

    Жыл бұрын

    el data de un token es siempre visible y desencriptable, por eso no debes poner informacion sensible en el, lo que protege y realiza la validacion del token es la firma, la que si esta encriptada con la palabra clave que tu eliges ....

  • @JhonathanRamirezCordobazer
    @JhonathanRamirezCordobazer Жыл бұрын

    No me reconoce username, ni roleId, a alguien le pasa igual ? const { userName, roleId } = decode(token);

  • @1976off

    @1976off

    Жыл бұрын

    A mi también

  • @juanfernandohurtadoguzman8980

    @juanfernandohurtadoguzman8980

    Жыл бұрын

    @@1976off tengo la solución

  • @juanfernandohurtadoguzman8980

    @juanfernandohurtadoguzman8980

    Жыл бұрын

    la solución era tipar las constantes: '* *' es lo añadido con referencia a la línea const token*: any* = localStorage.getItem('token'); const { username, rol }*: any *= decode(token);

  • @josefonseca2061
    @josefonseca20612 жыл бұрын

    Genial bro ... como puedo ocultar los que no tienen permiso de admin?

  • @141Brayan

    @141Brayan

    Жыл бұрын

    X2

  • @ernestoacostavelazquez7617
    @ernestoacostavelazquez76173 жыл бұрын

    me esta marcando n error en esta línea podrian ayudarme const {userName, roleId} = decode(token); marca el siguiente Error: src/app/guards/role.guard.ts:23:12 - error TS2339: Property 'userName' does not exist on type '{}'.mensaje de antemano gracias por su ayuda.

  • @joelgarciar

    @joelgarciar

    3 жыл бұрын

    No se si lo lograste resolver, pero yo lo resolvi asi. const expectedRole = route.data.expectedRole; const token = localStorage.getItem('token'); let decodetoken:any = {}; decodetoken = decode(token); console.log(decodetoken.username);

  • @alejandroguarin3743

    @alejandroguarin3743

    2 жыл бұрын

    @@joelgarciar Super me funciono gracias

  • @fabiolagarcia5130

    @fabiolagarcia5130

    Жыл бұрын

    @@joelgarciar Muchas gracias, me funcionó!!!

  • @aaronmejia5375

    @aaronmejia5375

    Жыл бұрын

    @@joelgarciar Muchas gracias, justo estaba batallando también con ese error!

  • @pw4645
    @pw46452 жыл бұрын

    No pero porque localstorage para el Token????? porque no usa lo correcto que es una variable de SESION o COOKIE ?????????????

  • @hernanvilar1960

    @hernanvilar1960

    2 жыл бұрын

    Como se guardaria en una cookies tienes idea? tengo el token desde un back pero no se como guardarlo en el front y luego obtenerlo para reenviarlo al back.

  • @arielzarate3643

    @arielzarate3643

    2 жыл бұрын

    no amigo eso se hacia antes .. ahora con jsonwebtoken se lo guarda en el localStorageo el sessionStorage depende de tu preferencias y del sistema , si es banco obviamente sera en el sessionstorage para que se loguee nuevamnete por seguirdad , pero si es una red social es mejor en el localStorage con un ExpiresIn:60x60x24

  • @RicardoLunaSantos
    @RicardoLunaSantos2 жыл бұрын

    Para cerrar sesión y destruir el token

  • @soyungnomofeo

    @soyungnomofeo

    2 жыл бұрын

    me uno a la pregunta +1

  • @aldobauvel

    @aldobauvel

    2 жыл бұрын

    alguna solucion?

  • @Benjaskeight

    @Benjaskeight

    Жыл бұрын

    @@aldobauvel pudiste?

  • @141Brayan

    @141Brayan

    Жыл бұрын

    Yo solucioné eso borrando el local storage con un boton que llama una función Botón que llama una función Salir Función utilizada para eliminar un item del local storage y posterior recargo la página logOut() { localStorage.removeItem('token'); window.location.reload(); }

  • @RicardoLunaSantos

    @RicardoLunaSantos

    Жыл бұрын

    @@141Brayan gracias

  • @angel1110951
    @angel11109513 жыл бұрын

    No se ve nada.ni se explica bien lo que haces los códigos no son legibles

  • @davidvillarreal5256
    @davidvillarreal52562 жыл бұрын

    Excelente vídeo, una duda, cuando trato de obtener token del local storage me genera error en la línea this.jwtHelper.isTokenExpired(token) subraya token diciendo que no se puede un valor null. Alguien sabe la solución?

  • @lbdt964

    @lbdt964

    2 жыл бұрын

    tuve el mismo error, en return false reemplace por: return token != null && !this.jwtHelper.isTokenExpired(token); ,espero te sirva tambien

  • @neodohko88

    @neodohko88

    2 жыл бұрын

    @@lbdt964 amiga donde puso eso que le soluciono la vida ?

  • @jacobtheboy_oficial7395

    @jacobtheboy_oficial7395

    2 жыл бұрын

    Tambien tengo el mismo error ayuden :(

  • @christianquispehumpiri3965

    @christianquispehumpiri3965

    Жыл бұрын

    @@lbdt964 me podrias ayudar porfa tambien tengo el mismo error

  • @jacobtheboy_oficial7395

    @jacobtheboy_oficial7395

    Жыл бұрын

    @Daniel Valerio Broncano Eso no sirvió brother, el comentario de Daiana G si sirvió