Access Tokens and Refresh Tokens: A Quick Guide

Tilak SinghTilak Singh
2 min read

In modern web and mobile apps, user authentication is critical. Two key components that help manage secure authentication are access tokens and refresh tokens. Here's a brief overview of what they are and how they work.

What is an Access Token?

An access token is a short-lived credential used to authorize a user to access protected resources. It's typically issued after login and sent with each request in the Authorization header

What is a Refresh Token?

A refresh token is long-lived and used to get a new access token after the old one expires. It’s stored securely and only sent when requesting a new access token.

Difference between Access Token and Refresh Token

Access TokenRefresh Token
Short lifespan: Usually valid for 5–60 minutes.Long lifespan: Valid for days, weeks, or even months.
JWT format: Access tokens often use JSON Web Token (JWT), which contains user info.Sensitive: Should be stored in secure locations like HttpOnly cookies.
Security: If compromised, the impact is minimized due to the short lifespan.Session persistence: Allows users to stay logged in without re-authenticating.

How They Work Together

  • User logs in: Receives both an access token and a refresh token.

  • Access token used: Sent with each request to protected resources.

  • Token expires: After expiration, the client sends the refresh token to request a new access token.

  • New access token: The server validates the refresh token and issues a new access token.

  • Logout: Both tokens are invalidated.

Reference:

https://youtu.be/L2_gIrDxCes?si=fIXrdIwNnQx9j-vK

Web DevelopmentJavaScriptNode.jsChaiCodeReactMongoDBaccess-tokenrefresh-token#HiteshChaudhary

0
Subscribe to my newsletter

Read articles from Tilak Singh directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Web DevelopmentJavaScriptNode.jsChaiCodeReactMongoDBAccess token and Refresh token#HiteshChaudhary @hiteshchoudharylco

Written by

Tilak Singh
Tilak Singh

A young self-taught and enthusiastic learner with strong attention to detail and adaptability. Passionate Next.js developer, skilled at transforming complex problems into high- performance user experiences. Known for crafting clean, scalable solutions with a touch of innovative design to create efficient, modern applications.