HttpOnly Cookie (Atribut Cookie Anti-XSS)

TL;DR: HttpOnly adalah atribut cookie yang melarang JavaScript di browser membaca isinya lewat document.cookie. Dengan flag ini aktif, token sesi tetap tidak terbaca meskipun halaman berhasil disisipi skrip jahat melalui serangan XSS. HttpOnly wajib dipasang di setiap cookie sesi, bersama Secure dan SameSite, sebagai lapisan pertahanan dasar aplikasi web modern.

Apa itu HttpOnly Cookie?

HttpOnly adalah atribut yang ditambahkan pada header Set-Cookie agar cookie hanya dibaca dan dikirim browser pada request HTTP, bukan oleh skrip di halaman. Tanpa HttpOnly, isi cookie bisa diambil dengan satu baris JavaScript lalu dikirim ke server penyerang. Spesifikasi lengkapnya didokumentasikan di MDN Set-Cookie, dan didukung semua browser utama (Chrome, Safari, Firefox, Edge) sejak lebih dari satu dekade.

Contoh header yang benar untuk cookie sesi:

Set-Cookie: session=abc123; HttpOnly; Secure; SameSite=Lax; Path=/; Max-Age=3600

Cara Kerja: HttpOnly vs Secure vs SameSite

Ketiganya menutup vektor berbeda dan idealnya selalu diaktifkan bersama. HttpOnly bekerja paling kuat saat dipasang berdampingan dengan SameSite dan Content Security Policy sebagai satu cookie security stack.

Contoh Penerapan

Pada aplikasi Next.js, cookie sesi diset dari Route Handler atau Server Action, bukan dari komponen klien:

import { cookies } from 'next/headers'

cookies().set('session', token, {
  httpOnly: true,
  secure: true,
  sameSite: 'lax',
  path: '/',
  maxAge: 60 * 60,
})

Library auth modern seperti Supabase Auth dan NextAuth sudah memakai default ini. Masalah justru muncul di aplikasi lawas: dalam beberapa audit proyek migrasi, Vito Atmo masih menemukan cookie sesi yang diset dari sisi klien tanpa HttpOnly, biasanya warisan implementasi jQuery atau PHP lama yang dipindahkan apa adanya. Memasang HttpOnly tidak menambah biaya, tidak merusak pengalaman pengguna, dan tidak butuh perubahan arsitektur.

Pertanyaan Umum

Apakah HttpOnly mencegah semua serangan XSS?

Tidak. HttpOnly hanya mencegah pencurian isi cookie oleh skrip. Skrip jahat tetap bisa mengirim request atas nama pengguna karena browser otomatis melampirkan cookie. Untuk menutup celah XSS itu sendiri, gunakan output escaping dan Content Security Policy.

Apakah aman menyimpan JWT di cookie HttpOnly?

Lebih aman dibanding localStorage, karena localStorage selalu terbaca JavaScript. Pasangkan JWT di cookie HttpOnly dengan Secure, SameSite=Lax, dan masa berlaku pendek plus mekanisme refresh.

Bagaimana cara memeriksa cookie saya sudah HttpOnly?

Buka DevTools Chrome, tab Application, panel Cookies. Kolom HttpOnly akan tercentang untuk cookie yang benar. Bisa juga diuji cepat dengan mengetik document.cookie di Console: cookie HttpOnly tidak akan muncul di hasilnya.