What is JWT and What is it Used For?

JWT is something that a newbie to the programming world doesn’t come across too often, but in my opinion is an absolutely necessary thing to learn, even if it is just to understand the concept.

Intro

JWT stands for JSON Web Token, and JSON stands for JavaScript Object Notation. When we open up this double abbreviation, we understand that we are dealing with an object, in the form of JavaScript, that is going to be used as a web token, or in other words, to get access, the same way you would use an arcade token to gain access to a game.

What is it used for?

JWT is used to securely gain access and communicate with different things, by using a key to encrypt the object but also to make sure that no one can manually make and send these objects without the secret key.

What does all that mean? In simple terms, you use a random key to generate and check the JWT authentically and then pass the object in.

Let’s see an example of how you would make it to better understand what its purpose is.

How to use it

You use a random set of characters and numbers(preferably long) like this:

342789rowacy847qoacty4387qoctywoq387

and use that as your key which you will pass to generate the JWT and also to make sure it was made by the correct person or program.

The actual JWT itself is a long set of characters too, like this:

eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWUsImp0aSI6ImFhNTcwNGFhLTllODgtNGY1OS1iMTgzLWIwODY1NGFjNjBiNSIsImlhdCI6MTYyNDE5OTg1OCwiZXhwIjoxNjI0MjAzNDU4fQ.IsmBAOZlOe4uzetx7wBO6HDgcgPF0BHAzJHJMqporac

And we can use this one, which is an example that https://www.jsonwebtoken.io/ gives when you first go to the site. This site is also where you can manually create your JWT but that should only be used for testing.

The three parts

In our case, let’s say we need to access an API and tell it that I am an admin and my name is John Doe. We would pass that information into a JWT generator as a JS object (which is the payload), and that makes up 1/3 of the JWT.

Another part of the JWT is the Header, which defines the type and also the algorithm used to encrypt and decrypt it. In this case:

{
“typ”: “JWT”,
“alg”: “HS256”
}

And the last part is the actual Key we spoke about before, which in the example case is “secret”, but NEVER do this, make it as random as possible because otherwise your secret code could be leaked and that is very bad.

These three parts are what make up a JWT and this is also how you can pass information to receive, update, query and more, in a secure way.

Adding to the Payload

There are many things you could add to the payload, aka the information part of the JWT. This could be anything from roles, access booleans or words, extra information, and also DATES.

Dates are an important one because you can pass in the creation date and also the expiration date, which adds an extra layer of security, not allowing the JWT’s to be re-used, which is also why some sites log you out of your account and tell you that the session expired.

Additionally, if you have a roles system or permissions system, you can control who has access to what. A basic user may only have access to change a username, whereas an admin can change much more, and a user that is not logged in may only be able to see limited information.

Conclusion

To conclude, JWT is an awesome way to verify and control who has access to what and keep your data as secure as possible. The initial flow may be confusing to many but once you get the hang of it, it becomes really fast and efficient to set up a strong system.

Every developer should know how this works to better control everything, whether you are a frontend, backend, or full-stack developer.

More content at plainenglish.io