JWT & Token Authentication

1. Token Authentication là gì?

Token Authentication là cơ chế xác thực trong đó Client đăng nhập và nhận một Token từ Server. Sau đó, Client sử dụng Token này trong các request tiếp theo để chứng minh rằng request đã được xác thực.

Thay vì gửi lại username/password cho mỗi request:

Login
  ↓
Access Token
  ↓
Các request tiếp theo dùng Token

2. JWT là gì?

JWT (JSON Web Token) là một dạng Token phổ biến được sử dụng trong Authentication.

JWT thường có dạng:

xxxxx.yyyyy.zzzzz

JWT gồm 3 phần:

Header.Payload.Signature

Ba phần này được nối với nhau bằng dấu ..

JWT thường được dùng để chứa các thông tin cần thiết để Server xác định User và kiểm tra tính hợp lệ của Token.

3. Cấu trúc JWT

Header

Header chứa thông tin mô tả Token, thường bao gồm:

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

Trong đó:

• alg: thuật toán được sử dụng để tạo Signature.
• typ: loại Token, thường là JWT.

Payload

Payload chứa các Claims, tức là những thông tin được đưa vào Token.

Ví dụ:

{
  "sub": "123",
  "role": "USER",
  "exp": 1690003600
}

Một số Claim phổ biến:

• sub: Subject, thường dùng để xác định User.
• iat: thời điểm Token được tạo.
• exp: thời điểm Token hết hạn.
• iss: bên phát hành Token.
• aud: đối tượng nhận Token.

Application cũng có thể có custom claims như role, userId, permission… Tuy nhiên không nên đưa thông tin nhạy cảm vào Payload.

Signature

Signature được dùng để kiểm tra JWT có bị thay đổi hay không và Token có được ký bằng key hợp lệ hay không.

Có thể hiểu đơn giản:

Header + Payload
      ↓
   Secret/Key
      ↓
   Signature

Khi Server nhận JWT, Server kiểm tra Signature. Nếu Payload bị thay đổi nhưng không thể tạo Signature hợp lệ tương ứng, Token sẽ bị từ chối.

4. Access Token

Access Token là Token được sử dụng để truy cập các API được bảo vệ. access token được sinh ra khi user đăng nhập để có quyền truy cập các api còn phân quyền sẽ là của authorization.

Ví dụ:

Authorization: Bearer <access-token>

Access Token thường có thời gian sống tương đối ngắn.

Lý do là nếu Token bị lộ, thời gian kẻ khác có thể sử dụng Token sẽ bị giới hạn.

Access Token hết hạn thì Server sẽ không chấp nhận Token đó nữa.

5. Refresh Token

Để User không phải đăng nhập lại mỗi khi Access Token hết hạn, hệ thống có thể sử dụng Refresh Token.

Refresh Token được dùng để yêu cầu một Access Token mới.

Access Token
→ Dùng để gọi API

Refresh Token
→ Dùng để lấy Access Token mới

Flow:

Login
  ↓
Access Token + Refresh Token
  ↓
Access Token hết hạn
  ↓
Gửi Refresh Token
  ↓
Server xác thực Refresh Token
  ↓
Access Token mới

Access Token thường ngắn hạn hơn Refresh Token.

Refresh Token cần được bảo vệ cẩn thận vì nếu bị đánh cắp, hacker có thể sử dụng nó để lấy Access Token mới tùy thiết kế hệ thống. Và Refresh Token thường được lưu ở nơi an toàn hơn, chẳng hạn HttpOnly + Secure cookie trong web app, đồng thời server có thể áp dụng rotation/revocation để giảm rủi ro khi token bị đánh cắp.

6. JWT và Authorization

JWT chủ yếu giúp Server thực hiện Authentication — xác định User là ai.

Sau đó hệ thống mới thực hiện Authorization — kiểm tra User được phép làm gì.

Ví dụ Token chứa:

{
  "sub": "123",
  "role": "USER"
}

Server có thể xác định:

User = 123
Role = USER

Sau đó kiểm tra User có quyền thực hiện API hay không.

Vì vậy:

JWT
 ↓
Authentication
 ↓
Xác định User
 ↓
Authorization
 ↓
Kiểm tra Role / Permission

Không nên hiểu rằng chỉ cần có JWT là User có toàn quyền truy cập API. vì đây chỉ là token để có thể sử dụng các api của user còn chưa tới phần phân quyền role.

7. JWT và Stateless Authentication

Một ưu điểm thường được nhắc đến của JWT là có thể hỗ trợ mô hình stateless authentication.

Server có thể xác thực request dựa trên Token mà không cần lưu một authentication session riêng cho từng Client.

Request
  ↓
JWT
  ↓
Verify
  ↓
Claims
  ↓
User

Điều này có thể thuận tiện khi hệ thống có nhiều API Server.

Tuy nhiên JWT không có nghĩa hệ thống luôn hoàn toàn stateless. Nếu hệ thống có Refresh Token, Token Revocation, Blacklist hoặc các cơ chế quản lý trạng thái khác thì vẫn có thể cần lưu state ở Server.

Thuận Đức

Xem tất cả bài viết của tác giả

Bài viết khác

Series 7 — Web Quality – Engineering :Testing – Unit Testing, Integration Testing, Web Performance – Core Web Vitals, Code Splitting, Lazy Loading

Series 7 — Web Quality – Engineering Bài 3: Testing – Unit Testing, Integration Testing và End-to-End Testing trong ứng dụng web 1. Vì sao ứng dụng web cần Testing? Trong quá trình phát triển Frontend, chúng ta thường kiểm tra ứng dụng bằng cách chạy website trên trình duyệt, nhấn vào các nút, nhập […]

Đọc thêm

Series 7 — Web Quality – Engineering : Authentication & Authorization

Series 7 — Web Quality – Engineering Bài 1: Authentication & Authorization – Xác thực và phân quyền trong ứng dụng web 1. Mở đầu Khi xây dựng một ứng dụng web có chức năng đăng nhập, chúng ta thường nghĩ rằng chỉ cần tạo biểu mẫu nhập email, mật khẩu và kiểm tra thông […]

Đọc thêm

Series 6 – Next.js Advanced – Production: Next.js Build & Deployment

Series 6 – Next.js Advanced & Production Bài 5: Next.js Build & Deployment – Từ mã nguồn đến môi trường Production 1. Mở đầu Trong quá trình phát triển một ứng dụng web, việc chạy thành công trên máy tính cá nhân chưa có nghĩa là ứng dụng đã sẵn sàng để đưa đến người […]

Đọc thêm

Series 6 – Next.js Advanced – Production: Next.js Internationalized Routing Next.js Static Export

Series 6 – Next.js Advanced & Production   Bài 3: Next.js Internationalized Routing – Tổ chức URL cho website đa ngôn ngữ 1. Mở đầu Sau khi xây dựng cơ chế dịch nội dung và định dạng theo locale, ứng dụng cần một cách để người dùng truy cập đúng phiên bản ngôn ngữ. Ví […]

Đọc thêm

Series 6 – Next.js Advanced & Production: Metadata & SEO, Internationalization (i18n) & Localization (l10n)

Series 6 – Next.js Advanced & Production Bài 1: Metadata & SEO trong Next.js – Tối ưu thông tin và khả năng hiển thị trên công cụ tìm kiếm 1. Mở đầu Khi xây dựng một website, việc hoàn thiện giao diện và chức năng mới chỉ là một phần của quá trình phát triển. […]

Đọc thêm

Series 5 – Next.js Fundamentals: CSR, SSR, SSG, ISR và cách lựa chọn

Series 5 – Next.js Fundamentals   Bài 7 : CSR, SSR, SSG và ISR – Các chiến lược Rendering trong Next.js 1. Mở đầu Khi xây dựng một website bằng React, chúng ta thường tập trung vào việc tạo component, quản lý state và hiển thị giao diện trên trình duyệt. Tuy nhiên, khi ứng dụng […]

Đọc thêm