Authentication with JWT

Ausath Ikram • Dec 12, 2024

Authentication

Authentication is the process of verifying the identity of a user by proving their identity with something they have, such as an email and password. Understanding authentication is crucial for building secure web applications.

The simplified process of authentication is as follows:

The user provides their credentials (e.g., email and password).
The server verifies the credentials.
If the credentials are valid, the server then create and handle a session to manage the user's authentication state.

There are many ways the server can handle the session. One common method is to use JSON Web Tokens (JWT).

JSON Web Tokens (JWT)

JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object.

JWT is a token-based authentication method that allows you to securely transmit information between parties. The token is generated by the server and sent to the client, which can then be used to authenticate the user.

Session management with JWT can be stateless, meaning the session data will be stored in the browser's cookies. The cookie is sent with each request, enabling the server to verify the user's identity.

Stateless sessions can be less secure if not implemented correctly. An alternative method is storing the session data in a database and only store the encrypted session ID in the browser's cookie. This method is more secure but requires more resources.

JWT Structure

A JWT token consists of three parts: the header, payload, and signature. Each part is separated by a period (.).

Header: Contains the type of token and the hashing algorithm used.

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

Payload: Contains the claims, which are statements about the user.

{
  "userId": "550e8400-e29b-41d4-a716-446655440000",
  "expiresAt": "2024-12-12T16:19:15.407Z",
  "iat": 1733933955,
  "exp": 1734020355
}

Signature: Used to verify the integrity of the token.

HMACSHA256(
  base64UrlEncode(header) + "." +
  base64UrlEncode(payload),
  secret
)

Therefore a JWT token typically looks like this:

xxxxx.yyyyy.zzzzz

All parts of the JWT are Base64Url encoded, but even so, it is still readable by anyone who has access to the token. Therefore, it is important to never store sensitive information in the payload, such as email addresses or passwords.

You can play around with JWT tokens using the JWT.io debugger.

JWT Session Management Flow

A typical stateless session management flow with JWT proceeds as follows:

Login: The user logs in by providing their credentials (e.g., email and password).
Token Generation: The server verifies the credentials. Upon success, it generates a JWT containing user claims such as userId, expiresAt, iat (issued at), and exp (expiry time).
Token Delivery: The server sends the JWT to the client. This is often done via an HTTP-only, secure cookie to protect against XSS attacks.
Token Storage: The client securely stores the token. For cookies, ensure httpOnly, secure, and sameSite attributes are set.
Request Authentication: With each request, the client includes the JWT, typically in an Authorization header or automatically via cookies.
Token Validation: The server validates the token using the secret key. If valid, it extracts user claims (e.g., userId) from the token to process the request.

This is a simplified flow, and there are many considerations to take into account when implementing JWT authentication. And as always, remember to never store sensitive information in the JWT payload.

Conclusion

JWT is a popular method for handling authentication in web applications. It is simple to implement and can be used to securely transmit information between parties. However, it is important to understand the limitations and security concerns when using JWT.

Stay tuned for a future post where we'll implement JWT authentication step-by-step in a Next.js application.

References

Blog