Angular 17 Login Refresh Token using interceptor | Angular Login | Jwt Token

In this Video I have explained Angular 17 Login with API integration with JWT token Plus Interceptor passing token in Headers.
Plus How to get refresh token once token Expires
Angular 17 Login with JWT Token.
Angular 17 login with JWT Token with Refresh Token Functionality .
Angular Login.
Guard In Angular 17.
Authentication in Angular 17.
Authentication and Authorization in Angular 17.
How to Protect Route in Angular 17.

Learn From me

Connect With Me

API Used in video

All code will be at

Visit Our Mini Project Ideas Portal where you can find So many project
ideas you can try to implement

Follow & Connect me on LinkedIn

#angular17
#angularlogin
#angulartutorial

[sambasivarao]

Very Nice video, thanks for helping with nice videos.

[frankoppermann]

Good explanation. For the refresh token, I think its better to store it in a http-only cookie. Its secure -> no access for attackers via javascript. With the refresh call the refresh token is automatically sent to the backend. Holding the refresh token in the angular app / browser is not necessary and insecure. Stealing the refresh token give attackers long access to the system. Acces tokens normally have a short lifetime 5 minutes for example.

[bxygkdq]

Good explanation. its better that, If share as video the APIs generation, for full stack knowledge

[tincho_mnj]

If you have a stand alone based application in angular 17 you don't have an app.module, how do you configure the interceptor then?

[ramunise]

What's the point of using a refresh_token if it's next to an access_token? In this case, if the access token leaks, then along with the refresh token.

[tubepankajyou]

Thank you Very much for the detailed explanation. Hi Sir, I am using Google IDP with implicit flow, How can I get a refresh token? silent-renew is not working.

[codewithraj]

when multiple api request at the same time and in one api request token is expired how to implement in this senerio refresh token and jwt token .

[abhishekagarwal]

if we use subjects n every component then when we emit its value all the components will subscribe it and calls unnecessary api's for eg i have 2 component dasboard and profile when i go to dashboard my api's give 401 then i call my refresh token and emit the subject value then my profile component will also subscribe it and calls the api which is not necessary and if i perform some action on button click and that api return 401 then how we will handle it

[DoItWithMe]

after implementation of interceptor, login api will also need token right? currently i am getting error for this so how can we avoid login api to go through interceptor cause its showing error that Cannot read properties of undefined (reading 'token')

[codewithraj]

is it best practice to return the refresh token in the response ?

[mikeweed]

Don't you need a Guard for your "Dashboard" route? How do you prevent an unauthenticated user from deep linking directly to it?

[papputarun]

very nice sir can you please share api for this app?

[sanket]

Is this the same approach normally industry follow means using interceptor

[vikashbanoriya]

Sir the same way we can implement Jwt, refresh token in realtime project also

[suryaguthula]

thanks alot for the excellent content. Keep it up.

[seloaneronald]

can you share your jwt refresh and token api source code? I created mine but isn't returning an object like yours....wanna see if am in a right directions.

[imvpjpz]

Sir, could you please provide api code user in this video?

[chandreshkumar]

onLogin and refreshToken api giving cors error.

[phuccute]

Hi sir at 34:00 video when i use router to navigate link to one component it success but when i reload page in that component (example: your component 'localhost:3005/dashboard') it error pages loading not show api not show error message hope you can help me.