DEV Community

Hamza
Hamza

Posted on

3 2 2 1 2

What is JWT ?

Json Web Token (JWT)

learning objectives :

  • Know What is JWT
  • Know how does it work

Hola , i'm Hamza (know more about me in Bio)
today's article is going to be about JWt , i'll explain it in my own way hopefully you get it perfectly ๐Ÿ‘Œ

so first JWt is as i mentioned before it is a json web tokens, so let me make things more easy let me show you an example :

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c

this surly isn't a link or just meaningless characters , it is actually a user claims or in other hand "user's data"

Token is divided into 3 parts first part or in more professional terms The header , the header is referred to the algorithm that are used in and the Token Type, for example:

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9
Enter fullscreen mode Exit fullscreen mode

{
"alg": "HS256",
"typ": "JWT"
}

the second part which is the PAYLOAD this is referred to Data ๐Ÿ“Š:

eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ
Enter fullscreen mode Exit fullscreen mode

{
"sub": "1234567890",
"name": "John Doe",
"iat": 1516239022
}

last part , which is the VERIFY SIGNATURE :

flKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c
Enter fullscreen mode Exit fullscreen mode

When client receives a JWT, it validates the signature to ensure its authenticity

Let's make things simple

  • JWts are used for securely transmitting data between two parties (usually client and server)
  • they consist of 3 segments : header, Payload and signature
  • each segment is base64 URL encoded and seperated by dots

Use Cases ?
=>JWTs are commonly used for managing user sessions on websites.
=>They provide authorization (access control) rather than authentication (proving identity).

Remember that verifying the signature ensures the integrity of the data within the JWT, making it a critical step in secure communication. ๐ŸŒŸ

For now i gotta say goodbye, it was hamza hope you enjoyed reading my article this was part(1) wait for part (2) , see you soon guys ๐Ÿ‘‹

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadogโ€™s testing tunnel.

Download The Guide

Top comments (0)

The best way to debug slow web pages cover image

The best way to debug slow web pages

Tools like Page Speed Insights and Google Lighthouse are great for providing advice for front end performance issues. But what these tools canโ€™t do, is evaluate performance across your entire stack of distributed services and applications.

Watch video