Refresh Tokens en Angular 18 usando interceptors

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 ก.พ. 2025

ความคิดเห็น • 39

  • @RubianoAndy
    @RubianoAndy 3 หลายเดือนก่อน +5

    Muchas gracias amigo por este aporte, pdt, para evitar los intentos repetitivos a la hora de realizar el refresh token, deben colocar esto al principio del interceptor
    // Deja pasar la petición sin interceptarla, para evitar un bucle infinito
    if (req.url.includes('/refresh-token'))
    return next(req);
    Con esto evitan que la petición del refresh-token sea interceptada mientras están interceptando la petición actual, lloré sangre descubriendo ese bug 😢😢😢😢

  • @HiroshyRojasSalcedo
    @HiroshyRojasSalcedo หลายเดือนก่อน

    muchas gracias! me quedo muy claro con tu ejemplo! 🤩🤩🤩🤩

  • @alexechavarria3283
    @alexechavarria3283 7 หลายเดือนก่อน +1

    Increible lo bien y claro que explicas! Contenido 100% de calidad y que puede comprender todo el mundo. 👏🏼👏🏼👏🏼

    • @Garajedeideas
      @Garajedeideas  7 หลายเดือนก่อน

      Gracias por tu comentario! Nos alegramos mucho de que nuestros vídeos te sirvan de ayuda :)

  • @88goeth
    @88goeth 7 หลายเดือนก่อน +7

    Mario Girón no lo conocía y es quizás el mejor descubrimiento este año para mí, que gran forma de enseñar. Es incluso mejor que Fernando Herrera, espero tenga más presencia en TH-cam, lo he buscado y tiene un canal abandonado. Una pena porque es excelente.

    • @mariogiron
      @mariogiron 7 หลายเดือนก่อน +2

      Muchas gracias. Échale un vistazo a este canal porque llevamos subiendo contenido desde hace años 😁

    • @jeremy.es17
      @jeremy.es17 4 หลายเดือนก่อน

      @@mariogiron Mario excelente contenido, una consulta el código del backend no esta subido a un repo en github?

  • @jorgelachapelle
    @jorgelachapelle 2 หลายเดือนก่อน +1

    Excelente explicación

  • @andrespodadera5874
    @andrespodadera5874 5 หลายเดือนก่อน

    Muchas gracias hombre, tenía como referencia una versión es más antigua y no me reconocía el uso del interceptor. Añadiéndolo al app.config funciona perfectamente

  • @maurovgarcia
    @maurovgarcia หลายเดือนก่อน

    Me ha salvado máster.

  • @leytonmanueldiaz2830
    @leytonmanueldiaz2830 7 หลายเดือนก่อน +2

    Más suscriptores para este señor por favor

    • @Garajedeideas
      @Garajedeideas  7 หลายเดือนก่อน

      Gracias por tu comentario! Nos alegramos mucho de que nuestros vídeos te sirvan de ayuda :)

    • @leytonmanueldiaz2830
      @leytonmanueldiaz2830 7 หลายเดือนก่อน

      @@Garajedeideas Son de lo mejor, saludos desde Colombia !!!

  • @lucasruiz6176
    @lucasruiz6176 7 หลายเดือนก่อน

    Impecable !! Muchas gracias por tus videos !

    • @mariogiron
      @mariogiron 7 หลายเดือนก่อน

      Gracias 😁

  • @davidwebchile
    @davidwebchile 7 หลายเดือนก่อน

    Gracias Mario! Muy clara la implementación.

    • @mariogiron
      @mariogiron 7 หลายเดือนก่อน +1

      Gracias a ti 😊

  • @jesuschunga1009
    @jesuschunga1009 4 หลายเดือนก่อน

    Excelente contenido 😎

  • @ae.h.h
    @ae.h.h หลายเดือนก่อน

    ¿Qué estrategia recomendarias para evitar que varios flujos de request crusen al mismo tiempo por un interceptor?. Mil gracias por este gran aporte.

  • @shokoshokao8947
    @shokoshokao8947 6 หลายเดือนก่อน +1

    Buenas! Creo que hay que hacer al menos una verificación del error.status obligatoriamente. Porque si pierdes tanto el token como el token de refresco, al llamar a refreshToken(), como es en si misma otra petición, va a volver a entrar al interceptor y te va a dar un error, por lo que va a volver a llamar a refreshToken() y a entrar en un bucle infinito. Yo lo solucioné, y porque el backend así me lo permitía, cortando el interceptor antes del refreshToken() si el error no es 403. No sé si es el mejor enfoque, pero me sirvió. Gracias por el video!

  • @RrenzOS
    @RrenzOS 4 หลายเดือนก่อน

    Tengo una pregunta , si quiero aprender angular de cara a conseguir mi primer empleo como junior frontend developer , que versión de Angular debería aprender al día de hoy ? Versión antes de la 17 y progresivamente la 18 y 19 ? o de la versión 17+ ? Y los proyectos que haría con angular para mi portafolio con que versión serían ?

  • @JavierAcrich
    @JavierAcrich 3 หลายเดือนก่อน

    verificando los claims del token en el interceptor, podrias saber si un token esta caducado antes de enviarlo al backend. De esa manera podrias ahorrarte un request.

  • @TravisDDr
    @TravisDDr 2 หลายเดือนก่อน

    Podrías hacer un ejemplo con angular fire?

  • @cramirez8562
    @cramirez8562 3 หลายเดือนก่อน

    A voz de pronto, solo chekeando el repo, el refesh token se solicita cada vez que hay un error http....
    No serìa interesante verificar si es 401 - unauthorized?
    O si el token ha expirado o no....?
    Gracias

  • @GuppySn-acuario
    @GuppySn-acuario 4 หลายเดือนก่อน

    Puedes hacer un video, de como crear un appsetting.json tipo enviroment para que pueda usar un unico build para varias implementaciones?

  • @blackdeath166
    @blackdeath166 7 หลายเดือนก่อน

    yo estoy utilizando en mi back nestjs y graphql y en el front angular con apollo-angular, aqui se crea un modulo para la configuracion de apollo se puede utilizar los interceptos, porque yo en la misma configuracion, puedo estar mandando los tokens. O cual seria la forma mas adecuada?

    • @mariogiron
      @mariogiron 7 หลายเดือนก่อน

      Supongo que el interceptor captura de igual manera la petición que sale hacia tu server y que el cliente de Apollo se centrará más en cómo se envía y el formato y cómo recuperas la respuesta

  • @dieguillo6661
    @dieguillo6661 4 หลายเดือนก่อน

    solo se necesita el refreshtoken? yo le paso el token y el refreshtoken que va a expirar para obtener nuevo token y refreshtoken, asi lo tengo en mi backend es bueno de esa manera? o no es necesario pasar el token que va a caducar?

    • @oscarhernandez-ig8dj
      @oscarhernandez-ig8dj 3 หลายเดือนก่อน

      por lo general solo se utiliza el refresh token

  • @daniel-peiro
    @daniel-peiro 5 หลายเดือนก่อน

    Qué edad tienes amigo mío?
    A mi que me cuesta tener claro un sólo lenguaje (C#) y algo de typescript, flipo que seas tan bueno con tantos lenguajes y tantos frameworks
    Das rabia (de buen rollo jejeje)

  • @Shinigami4rt
    @Shinigami4rt 5 หลายเดือนก่อน

    Hola, tienes uno igual con Vue 3 ? 🧐👀

    • @Garajedeideas
      @Garajedeideas  5 หลายเดือนก่อน

      Hola! Lo que tenemos de Vue, lo tienes en esta playlist que hicimos: th-cam.com/video/LJBNmeB2bW4/w-d-xo.html , por si puedes localizar algo que te pueda ayudar. Sino, gracias por tu feedback y lo tendremos en cuenta para ver si podemos cuadrarlo más adelante 😉

  • @martinflores9611
    @martinflores9611 4 หลายเดือนก่อน

    y generalmente que se pone en el token ?? solo el id del usuario o puede ser toda la info ejemplo nombre, edad, sexo etc

    • @gamuro6977
      @gamuro6977 4 หลายเดือนก่อน +1

      creo que solo el id y cifrado

    • @oscarhernandez-ig8dj
      @oscarhernandez-ig8dj 3 หลายเดือนก่อน

      @@gamuro6977 el rol del usuario para controlar las rutas en angular

    • @RubianoAndy
      @RubianoAndy 3 หลายเดือนก่อน +1

      Entre menos información le coloques a los tokens, mucho mejor, yo en lo personal coloco el userId y ya con consultas utilizando el interceptor, me traigo la información que necesito

    • @martinflores9611
      @martinflores9611 3 หลายเดือนก่อน

      @@RubianoAndy ok entonces el interceptor hace la peticion para traerte los datos ya del usuario y guarlos por ejemplo en local storage ??

  • @MijaelParionaTarqui
    @MijaelParionaTarqui 19 วันที่ผ่านมา

    bucle infinito