Lý thuyết về Cookie & Session & Localstorage

1. Cookie

Cookie là các gói dữ liệu nhỏ được máy chủ web gửi đến và được lưu trữ trên trình duyệt của người dùng. Cookie được sử dụng để lưu trữ dữ liệu giữa các yêu cầu HTTP (stateless requests) và giúp duy trì trạng thái hoặc lưu trữ thông tin người dùng.

Đặc điểm:

• Dung lượng lưu trữ: Giới hạn thường là khoảng 4KB.
• Thời gian sống (TTL): Có thể là session-based (xóa khi trình duyệt đóng) hoặc persistent (có thời gian hết hạn).
• Phạm vi: Cookie có thể được truy cập bởi các trang thuộc cùng một domain và có thể được chia sẻ giữa các trang trong cùng một domain nếu có đường dẫn tương ứng.
• Bảo mật: Cookie có thể được bảo mật bằng cờ Secure (chỉ truyền qua HTTPS) và HttpOnly (không thể truy cập từ JavaScript để chống tấn công XSS).

Cách sử dụng:

• Quản lý phiên đăng nhập.
• Lưu thông tin giỏ hàng trong thương mại điện tử.
• Theo dõi hành vi người dùng để phân phối quảng cáo.

Ví dụ:

Cookie có thể được gửi từ máy chủ về client với tiêu đề Set-Cookie trong HTTP:

Set-Cookie: sessionId=abc123; HttpOnly; Secure; Path=/; Max-Age=3600

Ưu điểm:

• Giúp lưu trữ trạng thái người dùng qua các yêu cầu HTTP.
• Có thể thiết lập dễ dàng và sử dụng trực tiếp từ phía máy chủ.

Nhược điểm:

• Bị giới hạn về kích thước (4KB).
• Có thể gây ra các vấn đề bảo mật nếu không sử dụng đúng cách (XSS, CSRF).
• Có thể bị xóa hoặc từ chối bởi người dùng.

2. Session

Session là một khái niệm nhằm lưu trữ thông tin phiên làm việc của người dùng trên máy chủ. Mỗi người dùng khi truy cập vào trang web sẽ có một session riêng, thường được xác định qua một ID duy nhất (Session ID).

Đặc điểm:

• Dung lượng lưu trữ: Không giới hạn trên máy chủ, phụ thuộc vào cấu hình máy chủ.
• Thời gian sống: Thường kết thúc khi người dùng đóng trình duyệt hoặc sau một thời gian không hoạt động (thời gian hết hạn session được cấu hình bởi máy chủ).
• Phạm vi: Session chỉ tồn tại trên máy chủ và được kết nối với người dùng thông qua Session ID, thường được lưu dưới dạng cookie.
• Bảo mật: Bảo mật hơn cookie vì dữ liệu lưu trên máy chủ, nhưng vẫn có thể bị tấn công CSRF nếu Session ID bị đánh cắp.

Cách sử dụng:

• Thường dùng để quản lý phiên đăng nhập và dữ liệu phiên làm việc của người dùng mà không cần lưu trữ trực tiếp trên trình duyệt.

Ví dụ:

Trong PHP, bạn có thể khởi tạo session và lưu trữ thông tin:

session_start();
$_SESSION["username"] = "john_doe";

Ưu điểm:

• Bảo mật hơn cookie vì dữ liệu không lưu trữ trực tiếp trên trình duyệt.
• Không bị giới hạn dung lượng.

Nhược điểm:

• Phụ thuộc vào máy chủ, tốn tài nguyên máy chủ để quản lý phiên làm việc.
• Cần cơ chế đồng bộ giữa session và cookie để nhận diện người dùng.

3. LocalStorage

LocalStorage là một phần của Web Storage API, cho phép lưu trữ dữ liệu trên trình duyệt dưới dạng cặp key-value và dữ liệu này không bị xóa khi đóng trình duyệt. Khác với cookie, LocalStorage chỉ có thể được truy cập thông qua JavaScript và không được gửi lên máy chủ qua các yêu cầu HTTP.

Đặc điểm:

• Dung lượng lưu trữ: Lớn hơn cookie, thường từ 5MB đến 10MB tùy trình duyệt.
• Thời gian sống: Dữ liệu lưu trữ lâu dài, không bị xóa khi đóng trình duyệt, trừ khi người dùng xóa thủ công.
• Phạm vi: Chỉ có thể truy cập từ cùng một domain.
• Bảo mật: Không tự động gửi dữ liệu qua HTTP, nhưng vẫn có thể bị truy cập bởi các script nếu trang web không được bảo vệ đúng cách.

Cách sử dụng:

• Lưu trữ dữ liệu tạm thời, như các cài đặt của người dùng, mà không cần lưu trữ trên máy chủ.

Ví dụ:

// Lưu trữ dữ liệu
localStorage.setItem("username", "john_doe");

// Lấy dữ liệu
const username = localStorage.getItem("username");

// Xóa dữ liệu
localStorage.removeItem("username");

Ưu điểm:

• Dung lượng lớn hơn cookie.
• Lưu trữ lâu dài và dễ sử dụng thông qua JavaScript.

Nhược điểm:

• Không thể truy cập từ phía máy chủ.
• Không bảo mật cao, dễ bị truy cập nếu trang web bị tấn công XSS.

So sánh giữa Cookie, Session và LocalStorage

Kết luận:

• Cookie thích hợp cho việc lưu trữ thông tin nhỏ và ngắn hạn, đặc biệt là những thông tin cần gửi qua lại giữa trình duyệt và máy chủ.
• Session là lựa chọn tốt để lưu trữ thông tin bảo mật như phiên làm việc của người dùng và đăng nhập, với dữ liệu chỉ lưu trên máy chủ.
• LocalStorage cung cấp khả năng lưu trữ dữ liệu lâu dài trên trình duyệt mà không bị giới hạn bởi kích thước nhỏ của cookie, nhưng không phù hợp cho dữ liệu nhạy cảm vì chỉ có thể bảo vệ bằng JavaScript.