How JWT Works - Client and Server
HTML-код
- Опубликовано: 10 сен 2024
- This tutorial explains how you can create JSON Web Tokens with NodeJS and Express as well as how to save the tokens in the browser and then upload and validate the tokens using fetch.
Code from video: github.com/pro...
JWT official website: jwt.io/
This channel contains awesome resources. I always get most of the issues i have sorted after watching your videos. The way you teach is reassuring and there is a calmness to how you go about your teaching. Tremendous job.
Every tutorial is so well explained. You have the art of getting concepts across in an easy to understand manner.
you saved me so many times sir a very big thank you ❤❤
Steve, You are doing a wonderful job to the society. Please keep up this good work man.
This is exactly what I was looking for, I needed to understand how it works and verifies on server side, thank you
Absolutely enlightening. Now I'll have to adapt this to a PHP server!
awesome as usual!
from South Africa here. man thank you for this. im 18 and learning code frustrates at times
absolutely this is one of the best video on jwt present on youtube worth of time.
amazing work sir i am waiting for your new videos.
best video i ever seen on jwt
❤ I love your videos it is clear explanation, detailed, helpful, and more than that. Thank you
Professor Steve! You are my saviour, as always. I absolutely love your channel and I really appreciate what you do. One small thing: I've made a pull request on the repo because there was a problem with the .catch() callback functions. Cheers!
BIG BIG LIKE 👍
Another concise and great tutorial
Awesome. Big thanks
very very informative video sir, after watching this course, I become your fan.
GOLDEN as usual.
Your tutorials are always awesome with very clear explanations. You deserve much more views than what you currently have. Maybe you should consider creating a twitter account? Many more people could find your content after you build a lot of followers there. I know you may not want to do that, it's just an idea. Thanks for the content that you produce.
I have one - twitter.com/prof3ssorSt3v3
@@SteveGriffith-Prof3ssorSt3v3 Followed! I searched for "
Steve Griffith" before but could not find you, maybe i did not look hard enough.
You can see that by the dislikes. He is an awesome teacher
Awesome as always 🙂
Many Thanks for your work as always! It would be outstanding if you'd expand this tutorial by involving refresh token to this cycle.
It already does check for an expired token. After that your user needs to go through whatever login validation process you already have and then call the jwt.sign method again.
@@SteveGriffith-Prof3ssorSt3v3 if I'm not mistaken, now if token is expired, the user will be logged out, but refresh token will give user a chance to persist logged in for some time
@@rmnkot yes, so just before the initial token expires, you need to get a refresh token
Hi Steve,
It will be good if you add a poll in your video and folks will vote on it.
Like.. you what will be the next topic? and then you can show 5-10 options in the poll...
Then we can vote on it and thus you will get a topic for the next video.
Also in the next video, you can update the poll also.
I plan my videos out usually weeks before they are released. I look at the requests that I get here - ruclips.net/video/LCezax2uN3c/видео.html - and the votes on those topics. I also make videos based on the things that I need for what I am teaching at my College.
Thank you!
Steve, do you have experience with Electron JS for desktop apps ?
Thatd crazy to have a advanced course from you on that if thats the case. Id pay for that course. Cheers
It's on my todo list. No idea when I will get to it though
@@SteveGriffith-Prof3ssorSt3v3 nice and thanks for all your videos
Try brad travesy on udemy
@@tipsharp6494 yes thanks for the info youre right its good. But Steve as some way of teaching that is better for me.
Wow, thanks bro
i wonder if you have ever thought of teaching algorithms...that would be really awesome...
cool video, thanks bro
hi, how can i make headers global set on login status success in client side, and than i want to skip pushing headers on every get or post
headers are sent with EVERY request and response. They are not something that you can turn off or on.
@@SteveGriffith-Prof3ssorSt3v3 thank you for your reply, here is my example
like when loggin success put headers and tokent localStorage i.imgur.com/G2X63vI.png
and here im trying to console log it i.imgur.com/H3sDSQN.png it says undefined
Excellent Tutorial, exactly what I needed, just one question => Is it safe to store JWT Token in Local Storage if not then where should I store that Token
Yes. That is the best place to store them in my opinion
@@SteveGriffith-Prof3ssorSt3v3 Thanks for the Reply, actually some of the online articles says that stop using local storage to store jwt token that's why I had a doubt
@@SteveGriffith-Prof3ssorSt3v3 I am a beginner , so seriously is this the best way to store the token client side
@@gowthamvamsimavuri2694 yes. Tokens can be saved in cookies or in session storage. They should be signed by the server and have a short lifespan.
let payload = {
_id: id,
exp: expires,
}
if i change exp to _expires or any other string, jwt.verify does not throw error after token has expired.
Is it expected behavior ?
The standard for jwt is to use the three letter codes.
When you send the jwt in the header for each request , to each api, what is the logic on the server that needs to happen, jwt.verify? that means for each api, i need to write the same checking function?
Yes. The jwt.verify method uses the private key which was used to sign the token to verify it. Each API should have a unique private key.
@@SteveGriffith-Prof3ssorSt3v3 do you discuss this in your video., As it's a key component to making jwt secure protected routes. So you have an example of this function.
nice man
Nice tutorial, it's could be great to have session authentification too. Thx
Please add any tutorial ideas in the comments here - ruclips.net/video/LCezax2uN3c/видео.html
great showcase. thank you steve. any chance you can implement the full flow with a refresh token?
It has the test for the expired token in the server get('/test') route. If it fails then you can call the get('/token') route to get a new token.
This example was kept intentionally simple without the login and validation of passwords. You can implement whatever logic you want for creating the new token. The timestamp is in the payload.exp property of the token so you can use that as a trigger to refresh the token instead. There could be an alternative test to see how far expired the token is. Maybe the token is good for 15 minutes but you will refresh it up to 20 minutes or require a new login validation.
Can you please make a tutorial on how a refresh token works, and the best way to use it. And also how it works hand in hand with the access token. pleasee :)
Please post tutorial requests in the comments here - ruclips.net/video/LCezax2uN3c/видео.html and vote for the ones you like.
what folder theme are you using
Theme is just the default dark+. If you are referring to the icons for folders, that is an extension - vscode-icons
Which font are you using? Thanks for the tutorial
In VSCode? Jet Brains Mono
Is it safe to store token in localStorage?
yes. Tokens are temporary.
how to detect that user token is expired, and need to refresh now
As shown in the video with the verify method.
All your videos are nice. Can you share video on nodejs jwt authentication restApi without sequalize for mysql
Please put any tutorial requests in the comments here - ruclips.net/video/LCezax2uN3c/видео.html
@@SteveGriffith-Prof3ssorSt3v3 I will do that
so great, can i ask what is the theme you use for the icons of the project files?
It is the vscode-icons extension.
It's safer to store tokens in cookies rather than localstorage
Doesn't really make a difference where you store them. However, I find localStorage to be safer, especially for newer developers.
If they are in cookies then you need to be careful about how they are created and they can accidentally be sent to places you didn't intend.
With LocalStorage you have to make the conscious decision to add the token and send it.
I too struggled with this decision as 99pct of devs will say cookies with http only so JS cannot access the cookie. I first did local storage but now I only store a short lived refresh token in a http only cookie. The real token is never stored only in memory on the client state
@@SteveGriffith-Prof3ssorSt3v3 stackoverflow.com/questions/44133536/is-it-safe-to-store-a-jwt-in-localstorage-with-reactjs
Please make a video on Google authentication
Please post any tutorial requests in the comments here:
ruclips.net/video/LCezax2uN3c/видео.html
Be sure to explain exactly what you are looking for and vote on other topics that people have posted.
🎖️💝👍🏽🔥
make a viddeo on security using a jwt