Cookie adalah potongan kecil data yang disimpan browser dan dikirim balik ke server di tiap request. Bayangin gelang masuk acara: server memasangkannya di browser, dan browser menunjukkannya tiap kali datang. Flag cookie adalah aturan di gelang itu. Tanpa flag yang benar, gelangnya gampang dicuri atau dipakai di tempat yang salah.
🧪 Tebakan cepat: kamu klik sebuah link dari situs lain menuju situs bank-mu. Cookie bank-mu yang ber-
SameSite=Laxikut terkirim atau tidak? Tebak dulu, jawabannya ada di bagian "SameSite".
Cookie: dikirim tiap request
Server memasang cookie lewat header Set-Cookie, dan browser mengirimnya kembali di tiap request ke situs itu. Yang dititipkan sebaiknya cuma nomor tiket (session ID), bukan data penting. Tiga flag di bawah ini menentukan seberapa aman cookie itu.
HttpOnly: JavaScript tidak bisa baca
Flag HttpOnly membuat cookie tidak bisa dibaca oleh JavaScript lewat document.cookie. Gunanya: kalau situsmu kena XSS, script penyerang tetap tidak bisa mencuri session ID.
Set-Cookie: sessionId=abc123; HttpOnly
- Tanpa HttpOnly,
document.cookiebisa membacasessionId, dan satu celah XSS cukup untuk mencurinya. - Dengan HttpOnly,
document.cookietidak memunculkansessionIdsama sekali. Jadi flag yang mencegah JavaScript membaca cookie adalah HttpOnly.
Secure: cuma lewat HTTPS
Flag Secure membuat cookie cuma dikirim lewat koneksi HTTPS. Di koneksi http:// biasa, cookie tidak ikut terkirim, jadi penyadap jaringan tidak bisa menangkapnya. Flag yang memastikan cookie cuma lewat HTTPS adalah Secure.
Set-Cookie: sessionId=abc123; HttpOnly; Secure
SameSite: kapan cookie dikirim lintas situs
Flag SameSite mengatur apakah cookie ikut dikirim waktu request datang dari situs lain (cross-site). Ini proteksi utama terhadap CSRF. Nilainya ada tiga. Anggap koneksi sudah HTTPS:
| Jenis request | Strict | Lax | None |
|---|---|---|---|
| Dari situsmu sendiri (same-site) | dikirim | dikirim | dikirim |
| Klik link dari situs lain (navigasi GET top-level) | tidak | dikirim | dikirim |
| POST atau fetch dari situs lain | tidak | tidak | dikirim |
- Strict paling ketat: cookie tidak pernah dikirim untuk request cross-site, bahkan saat kamu klik link dari situs lain. Nilai SameSite yang paling ketat adalah Strict.
- Lax (default browser modern): dikirim untuk navigasi GET top-level (klik link), tapi tidak untuk POST atau fetch lintas situs. Jadi jawaban tebakannya: dengan
SameSite=Lax, klik link dari situs lain tetap mengirim cookie, karena itu navigasi GET top-level. - None: cookie selalu dikirim, termasuk POST lintas situs. Karena itu
SameSite=Nonewajib disertaiSecure, dan tanpaSecurebrowser menolak cookie-nya.
Set-Cookie: sessionId=abc123; HttpOnly; Secure; SameSite=Lax
Prefix cookie
Browser modern mendukung prefix nama untuk keamanan tambahan:
__Secure-: cookie wajib punya flagSecure.__Host-: wajibSecure, tanpaDomain, danPath=/. Ini mengunci cookie ke satu host.
Set-Cookie: __Host-sessionId=abc123; Secure; HttpOnly; Path=/
⚠️ Jebakan yang sering ketemu
- Cookie session tanpa HttpOnly. Begitu ada XSS, session ID langsung bisa dicuri. Pasang HttpOnly untuk cookie sensitif.
- Lupa Secure di production. Tanpa Secure, cookie bisa bocor di koneksi http. Selalu Secure di production.
- Pakai SameSite=None tanpa Secure. Browser akan menolak cookie-nya diam-diam. None selalu berpasangan dengan Secure.
- Menyimpan data sensitif langsung di cookie. Simpan cuma session ID, data aslinya di server.
TL;DR: Cookie dikirim ke server tiap request, jadi flag-nya menentukan keamanannya. HttpOnly menghalangi JavaScript membaca cookie (lindungi dari XSS). Secure membuat cookie cuma lewat HTTPS. SameSite mengatur pengiriman lintas situs: Strict tidak pernah mengirim cross-site, Lax mengirim cuma untuk klik link (navigasi GET top-level), None selalu mengirim tapi wajib Secure. Untuk cookie session yang kuat: HttpOnly; Secure; SameSite=Lax (atau Strict), dan pertimbangkan prefix __Host-.
