What is JWT (Json web token)

It is sure you have used JWT many times in your projects but have you ever think about what is this JWT?

in this article we are going to see, what is JWT? what it is for, how it can be created. what the structure of JWT?

what the heck is jwt?

google give me this answer, (JWT) is a means of representing claims to be transferred between two parties. The claims in a JWT are encoded as a JSON object that is digitally signed using JSON Web Signature (JWS) and/or encrypted using JSON Web Encryption (JWE).

absolutely right but can you understand this? okay let’s talk about it in simple way.it’s an open standard this means anyone can use it. and why it is used it is used to securely transfer information between any two users. it is used because it is digitally signed this means information is verified and trusted there is no mutation of data in between the transfer. and it is compact. so compact that you can just send it via URL as GET requests then you can send this as a POST request as a HTTP header.

main and most important characteristic is self-contained the information about the user . and this avoid querying the database more than once suppose you have logged in or your user just logged in one time you verify the information like username
password then you just provide a token so every other time the user going to
request something from your server you don’t have to login you just have to
pass that token and then JWT system will just verify that token and if that
passes give the information or respond to that request that’s the case of self
contained a single token is having everything in it.

let’s deep dive into JWT

if you visit https://jwt.io/

you can see in the left box an example of jwt token, there are 3 parts (in red purple, light blue).

red part is actually the header ( base encoded ). it is nothing but simple javascript object that’s include algorithm, in that case, it is HS256, this is the encoding algorithm of this particular JWT token( you can see this object in the top right corner box). and it tells about type of token.

the purple part is the payload (base 64 encoded payload part). payload again have a structure itself JSON object ( middlebox in the right side )simply and
it contains the claims and what is claims? claims are the user details (username, password )or additional metadata like expiry date of the token etc.

then the most important part which is signature why we are using signature? we told the JWT that in the header , yeah we are going to use this kind of token and you have to encode this with this type of algorithm then we have told the JWT that these are the fields I am going to pass these are the things which you self-contained but how we will ensure that this data will not change while transferring to one user to other user. so here comes the signature. signature uses base64 header then concatenate with base64 version of payload and all these things then HMACSHA256 encoded this contain base64 header base64 payload with a secret and this important thing because if someone even changed the payload he don’t know about the secret and then this signature will not exactly the same as the original payload.

let’s see how this is happening,

suppose you are going to login into some website.

  1. then from the browser, you send a post request to the server with the credential like the username and
    password then server catch that, verified that, authenticate that.

2 and 3. if everything good JWT is generated with a secret and then that passed back to the browser.

4.if we get a successful JWT then we will send the JWT on the header on the post request on URL.

5.to access some protected resources on the remote website then on the server first server checks about the JWT if JWT signature matches with the signature server will define then it is you.

6.if information that everything is good server sends response to you and you can access this protected field and resources or routes in the server.


so this is the jwt is in nutshell. I hope you understand the concept behind the JWT. in the next article we will see how to implement a node js server with JWT authentication. until then Happy Coding!!!




Software Engineer at hSenid Mobile

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

React vs Vue: A Code Comparison

Create an Annuity Calculator in Javascript and React

UI journey of .NET developer — 7-React Redux and SMK Gallery API

What happens when you type ls -l in the shell?

The simplest way to setup React Native with TypeScript

Front-end Optimization — 4 Tips to Improve Web Performance | Inoxoft

How do I migrate RequireJS modules from ScriptBundle to Webpack on ASP .NET?

The World of React in 2021- by Flawless Technologies

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
hasanga lakdinu

hasanga lakdinu

Software Engineer at hSenid Mobile

More from Medium

Why Should You Use Node JS ?

Basic “ Hello World ” Node.js and Express app

JavaScript: Multi-tool program or unfitting for large-scale software development?

Debugging Node JS