Setiap cookie berisi pasangan nilai kunci bersama dengan sejumlah atribut yang mengontrol waktu dan tempat cookie tersebut digunakan.
Pengenalan atribut SameSite
(ditentukan dalam
RFC6265bis)
memungkinkan Anda mendeklarasikan apakah cookie dibatasi untuk konteks pihak pertama atau
situs yang sama. Akan sangat membantu untuk memahami secara tepat apa arti 'situs' di sini.
Situs adalah kombinasi dari akhiran domain dan bagian dari domain tepat
sebelumnya. Misalnya, domain www.web.dev
adalah bagian dari situs web.dev
.
Istilah kunci: Jika pengguna menggunakan www.web.dev
dan meminta gambar dari
static.web.dev
, berarti permintaan tersebut adalah situs yang sama.
Daftar akhiran publik menentukan halaman yang dianggap
berada di situs yang sama. Composable ini tidak hanya bergantung pada domain level teratas seperti .com
,
tetapi juga dapat menyertakan layanan seperti github.io
. Hal ini memungkinkan
your-project.github.io
dan my-project.github.io
dihitung sebagai situs terpisah.
Istilah kunci: Jika pengguna menggunakan your-project.github.io
dan meminta gambar dari
my-project.github.io
, berarti permintaan tersebut merupakan permintaan lintas situs.
Menggunakan atribut SameSite
untuk mendeklarasikan penggunaan cookie
Atribut SameSite
pada cookie menyediakan tiga cara untuk mengontrol
perilaku ini. Anda dapat memilih untuk tidak menentukan atribut, atau Anda dapat menggunakan
Strict
atau Lax
untuk membatasi cookie ke permintaan situs yang sama.
Jika Anda menetapkan SameSite
ke Strict
, cookie Anda hanya dapat dikirim dalam
konteks pihak pertama; yaitu, jika situs untuk cookie cocok dengan situs yang ditampilkan
di kolom URL browser. Jadi, jika cookie promo_shown
ditetapkan sebagai berikut:
Set-Cookie: promo_shown=1; SameSite=Strict
Saat pengguna berada di situs Anda, cookie akan dikirim bersama permintaan seperti yang diharapkan.
Namun, jika pengguna mengikuti link ke situs Anda dari link lain, cookie
tidak akan dikirim berdasarkan permintaan awal tersebut.
Cara ini cocok untuk cookie yang berkaitan dengan fitur yang selalu berada di belakang navigasi
awal, seperti mengubah sandi atau melakukan pembelian, tetapi terlalu
batasan untuk cookie seperti promo_shown
. Jika pembaca Anda mengikuti link tersebut
ke situs, mereka ingin cookie dikirim sehingga preferensi mereka dapat diterapkan.
SameSite=Lax
memungkinkan browser mengirim cookie dengan navigasi
tingkat atas ini. Misalnya, jika situs lain mereferensikan konten situs Anda, dalam hal ini
menggunakan foto kucing dan memberikan link ke artikel Anda sebagai
berikut:
<p>Look at this amazing cat!</p>
<img src="https://blog.example/blog/img/amazing-cat.png" />
<p>Read the <a href="https://blog.example/blog/cat.html">article</a>.</p>
Dengan cookie yang ditetapkan ke Lax
sebagai berikut:
Set-Cookie: promo_shown=1; SameSite=Lax
Saat browser meminta amazing-cat.png
untuk blog orang lain, situs Anda tidak akan mengirimkan cookie. Namun, jika pembaca mengikuti
link ke cat.html
di situs Anda, permintaan tersebut akan menyertakan cookie.
Sebaiknya gunakan SameSite
dengan cara ini, tetapkan cookie yang memengaruhi tampilan situs ke Lax
, dan cookie yang terkait dengan tindakan pengguna ke Strict
.
Anda juga dapat menetapkan SameSite
ke None
untuk menunjukkan bahwa Anda ingin cookie dikirim dalam semua konteks. Jika Anda menyediakan layanan yang digunakan oleh situs lain, seperti
widget, konten tersemat, program afiliasi, iklan, atau login di
beberapa situs, gunakan None
untuk memastikan bahwa intent Anda jelas.
![Tiga cookie diberi label Tidak Ada, Longgar, atau Ketat bergantung pada konteksnya](https://web.dev/static/articles/samesite-cookies-explained/image/three-cookies-labelled-no-495f9afccf1cd.png?authuser=6&hl=id)
None
, Lax
, atau Strict
.
Perubahan pada perilaku default tanpa SameSite
Dukungan Browser
- 80
- 86
- x
Atribut SameSite
didukung secara luas, tetapi belum digunakan secara luas.
Sebelumnya, menyetel cookie tanpa SameSite
secara default mengirim cookie tersebut dalam
semua konteks, yang membuat pengguna rentan terhadap CSRF dan kebocoran informasi
yang tidak disengaja. Untuk mendorong developer menyatakan niatnya
dan memberi pengguna pengalaman yang lebih aman, proposal IETF,
Cookie Inkrementalitas Lebih Baik
menjabarkan dua perubahan utama:
- Cookie tanpa atribut
SameSite
diperlakukan sebagaiSameSite=Lax
. - Cookie dengan
SameSite=None
juga harus menentukanSecure
, yang berarti cookie tersebut memerlukan konteks yang aman.
Kedua perubahan ini kompatibel dengan versi lama dengan browser yang telah mengimplementasikan
atribut SameSite
versi sebelumnya dengan benar, serta
browser yang tidak mendukung versi SameSite
sebelumnya. Kebijakan ini dimaksudkan untuk
mengurangi ketergantungan developer pada perilaku default browser dengan membuat perilaku
cookie dan penggunaan yang dimaksudkan secara eksplisit. Setiap klien yang tidak mengenali
SameSite=None
harus mengabaikannya.
SameSite=Lax
secara default
Jika Anda mengirim cookie tanpa menentukan atribut SameSite
-nya, browser akan memperlakukan cookie tersebut seolah-olah cookie ditetapkan ke SameSite=Lax
. Sebaiknya Anda tetap
menyetel SameSite=Lax
secara eksplisit agar pengalaman pengguna lebih konsisten
di seluruh browser.
SameSite=None
harus aman
Saat membuat cookie lintas situs menggunakan SameSite=None
, Anda juga harus menetapkannya
ke Secure
agar browser dapat menerimanya:
Set-Cookie: widget_session=abc123; SameSite=None; Secure
Anda dapat menguji perilaku ini mulai Chrome 76 dengan mengaktifkan
about://flags/#cookies-without-same-site-must-be-secure
, dan dari Firefox 69
dengan menyetel network.cookie.sameSite.noneRequiresSecure
di
about:config
.
Sebaiknya perbarui cookie yang ada ke Secure
sesegera mungkin.
Jika Anda mengandalkan layanan yang menyediakan konten pihak ketiga di situs Anda, pastikan penyedia layanan Anda memperbarui cookie mereka, dan memperbarui cuplikan atau dependensi apa pun di situs Anda untuk memastikan penggunaan perilaku baru.
Resep kue SameSite
Untuk detail selengkapnya tentang memperbarui cookie agar berhasil menangani perubahan ini pada SameSite=None
dan perbedaan perilaku browser, lihat artikel lanjutan, resep cookie SameSite.
Terima kasih atas kontribusi dan masukan dari Lily Chen, Malte Ubl, Mike West, Rob Dodson, Tom Steiner, dan Vivek Sekhar.
Banner besar cookie oleh Pille-Riin Priske di Unsplash