#6 How to handle token expire in React Node | Logout user after token is expired || JWT token expire

hello guys welcome back to the debug Arena in the previous video I have implemented the logout functionality and also thought you that how can you keep your user logged in to your website until he presses the logout button now in this video I will show you that how can you expire your token after a certain period of time and also if the token is expired then the user should be automatically get logged out so without any delay let's get started let's get to the code [Music] this is the code of the node.js you can see here that this is my registered API this is my login API and this is my user data API if you are having trouble to understand this then you can go and watch all my previous videos and if you are a beginner then please go and watch that videos they are much like you will understand many things and after watching all that you will it will be very easier for you to understand all these things so the first thing is we have to expire the token like you can see your inside login we are getting email and password and here we are creating the token but you can see that we are not actually expiring the token so to expire the token you have to add here you can find this code the link is in description now here add expiration time so this is the time after which your token will be expired you can give here how many hours any hours any days anything so I am giving here only 10 10 is means that token will expire after 10 seconds so now I will just save this go here restart my server now come here let's login .com okay let me show you the token also that the token is already there currently it is not one two three four five so now I will be logged in token is there login is there now you can see if I refresh data is there but after 10 seconds this token will not be valid okay I think 10 seconds are over I click here and you can see the token is already there this is already there but we are not getting data because our token is expired we are not getting any warning because we haven't logged anything now let's handle the expiration of the token you can see that inside login API I am giving a time after which the token will expire inside user details we are verifying that whether the token is valid or not and if the token is valid then the details of the user has been stored inside the variable user so in the same way if the adder is occurred then also we have to store it and get it so let's do that for that we have to write here callback function and now I will just console here error now I will save it and also I will console result so let's see if I will give you a result [Music] I will give you a error save this go to your again restart the server yeah it is already restarted refresh this let's login one two three click on submit getting login successful I'm not getting the value yeah I will not and you can see here yeah I will not get the value I uh I will tell you the reason you can see that we are getting the result [Music] inside result we are getting the user data email and IAT after 10 seconds if I will reload this then we will get the error like you can see this is the console log which I we have done error okay so the next thing is why we are not getting the user data because we are consoling here like when this callback function is not there whatever data returning from result is already stored here but now the Callback function is there so the data so there is nothing which is stored here so we have to return the data now what I will do here is then I will return a expired so if we will get error we will store token expired inside the user otherwise we will return isn't so now if error occurs then user will contain this token expired and if everything goes well then it will contains the data of the user now let me handle that also like if user is equal equals to foreign expired then I will return this response and I will say error inside data I will say token expired and just save this now I think you are getting the clear idea that if our our token has been expired then the user will contain token expired the code will come to this and we will get the responses like this so let me show you just clear this normal app go here log out I will login again dot com I will go to here one two three four five if you click on submit login successful okay you can see here I'm getting the data foreign like we are getting the data the token has been stored inside console we are getting this ID and name and everything now after 10 second when I reload it you can see that we are getting data as token expired now we have to just handle this at our front end so let's do that also in front end come to your user details because we are handling here yeah what we have to write if data dot data is equals to Ken expired then we will First Alert open expired login again and now here we can call the logout function but like I think uh we have to do that buying thing that's why I'm calling this this is my logout function so now you can see that I am all when I hit the save button this alert appears and when I click here okay we are getting back I think it is running twice let's see I have made these changes no just remove this react.stick mode yeah now it should work so now let's all let's do all the thing again [Music] you can submit you can see I will logged in I am getting the data it has been three seconds the data are coming here also the data is coming now it has been 10 second when I reload it you can see the token expired login again or I can go here I can just go to localhost 3000 and you can see that I am not getting the data and I am getting here token expired you can handle this that this screen should not be shown I'm not doing that here and when I click on OK it should already get navigated back so in this way you can handle the expiration of one token in react.js and if you are thinking that when I write localhost 3000 how that dashboard had appeared so for that please watch previous video in that I have shown you that how can you handle that I hope you have learned about token expiration and that navigation thing that how modern website log out you after the token expiration and all and if you have learned that then please subscribe my channel and also share the video with your friends thank you

Channel: The Debug Arena

Views: 21,427

Keywords: Handle token expiration in react js, handle token expiration in node js, node js token expire, logout user on token expire, token expiration, jwt token expire, how to expire jwt token, how to see if token is expired, handle token expiration, react, node, mern stack, token expire in mern, login system in mern, login and registration authentication react, logout and expire token, logout authentication, make login system in react, Js

Id: ssPoMERaPlE

Length: 9min 23sec (563 seconds)

Published: Mon Dec 26 2022