Cookies & Sessions — Web Fundamentals

HTTP adalah stateless — server tidak ingat siapa kamu antara satu request ke request berikutnya. Cookies dan sessions memecahkan masalah ini. Cookies: Cookie…

HTTP adalah stateless — server tidak ingat siapa kamu antara satu request ke request berikutnya. Cookies dan sessions memecahkan masalah ini.

Cookies: Cookie adalah potongan data kecil yang disimpan di browser dan dikirim otomatis ke server di setiap request.

Set-Cookie: session_id=abc123; Path=/; HttpOnly; Secure; SameSite=Strict; Max-Age=86400

Atribut cookie penting:

Atribut Fungsi
HttpOnly Tidak bisa diakses JavaScript (cegah XSS)
Secure Hanya dikirim via HTTPS
SameSite Cegah CSRF (Strict/Lax/None)
Max-Age Berapa lama cookie valid (detik)
Path URL path mana yang mengirim cookie
Domain Domain mana yang menerima cookie

Sessions: Session menyimpan data pengguna di sisi server. Browser hanya menyimpan session ID di cookie.

Alur session:
1. User login → server buat session, simpan data di server
2. Server kirim session_id via cookie ke browser
3. Browser kirim cookie session_id di setiap request
4. Server baca session_id → ambil data user dari penyimpanan

Cookies vs Sessions:

Aspek Cookie Session
Penyimpanan Browser (client) Server
Ukuran max ~4KB Tidak terbatas
Keamanan Bisa dimanipulasi user Lebih aman
Performa Dikirim setiap request Hanya ID yang dikirim 
// Membuat cookie di JavaScript:
document.cookie = "theme=dark; max-age=2592000; path=/";

// Membaca semua cookies:
console.log(document.cookie); // "theme=dark; lang=id"

// Menghapus cookie:
document.cookie = "theme=; max-age=0";

// Di server (Express.js):
app.get("/login", (req, res) => {
  req.session.userId = 42;
  res.cookie("remember", "true", {
    httpOnly: true,
    secure: true,
    sameSite: "strict",
    maxAge: 30 * 24 * 60 * 60 * 1000 // 30 hari
  });
});

Best practices:

Yang akan kamu pelajari