Melihat, menambahkan, mengedit, dan menghapus cookie

Kayce Basques
Sofia Emelianova
Sofia Emelianova
GitHub

Cookie HTTP utamanya digunakan untuk mengelola sesi pengguna, menyimpan preferensi personalisasi pengguna, dan melacak perilaku pengguna. Masalah ini juga merupakan penyebab semua masalah "halaman ini menggunakan cookie" yang mengganggu formulir persetujuan yang Anda lihat di web. Panduan ini mengajarkan Anda cara melihat, menambahkan, mengedit, dan menghapus cookie halaman dengan Chrome DevTools.

Membuka panel Cookies

  1. Buka Chrome DevTools.
  2. Buka Application > Penyimpanan > Cookie, lalu pilih origin.

Panel Cookie.

Kolom

Tabel Cookie berisi kolom berikut:

  • Nama. Nama cookie.
  • Nilai. Nilai cookie.
  • Domain. Host yang diizinkan untuk menerima cookie.
  • Jalur. URL yang harus ada di URL yang diminta agar dapat mengirim header Cookie.
  • Expires / Max-Age. Tanggal habis masa berlaku atau usia maksimum cookie. Untuk cookie sesi, nilai ini selalu Session.
  • Size. Ukuran cookie, dalam byte.
  • HttpOnly. Jika benar, kolom ini menunjukkan bahwa cookie hanya boleh digunakan melalui HTTP, dan Modifikasi JavaScript tidak diizinkan.
  • Aman. Jika true (benar), kolom ini menunjukkan bahwa cookie hanya dapat dikirim ke server melalui koneksi HTTPS yang aman.
  • SameSite. Berisi Strict atau Lax jika cookie menggunakan SameSite eksperimental .
  • Kunci Partisi. Untuk cookie dengan status partisi independen, kunci partisi adalah situs URL level teratas yang dikunjungi browser pada awal permintaan ke endpoint yang menetapkan cookie.
  • Prioritas. Berisi Low, Medium (default), atau High jika menggunakan cookie yang tidak digunakan lagi Prioritas.

Untuk melihat nilai cookie, pilih nilai di tabel. Untuk melihat nilai tanpa encoding persen, centang Tampilkan URL yang didekode.

Filter cookie

Gunakan kotak Filter untuk memfilter cookie menurut Nama atau Nilai.

Memfilter cookie yang tidak berisi 'id'.

Pemfilteran menurut kolom lain tidak didukung. Filter tidak peka huruf besar/kecil.

Untuk menambahkan cookie arbitrer:

  1. Klik dua kali baris kosong di tabel.
  2. Masukkan Nama dan Nilai, lalu tekan Enter.

DevTools mengisi kolom wajib diisi lainnya secara otomatis. Anda dapat mengeditnya seperti yang dijelaskan berikutnya.

Mengedit cookie

Semua kolom dapat diedit, kecuali Size yang diperbarui secara otomatis.

Klik kolom dua kali untuk mengeditnya.

Menetapkan nama cookie menjadi 'DEVTOOLS!'

DevTools menandai cookie dengan nilai kolom yang tidak valid dengan warna merah.

Cookie dengan nilai Kunci Partisi yang tidak valid.

Untuk memfilter cookie yang valid, centang Hanya tampilkan cookie yang bermasalah di panel tindakan atas.

Menghapus cookie

Untuk menghapus cookie, pilih cookie tersebut dan klik Hapus yang dipilih di panel tindakan di bagian atas.

Menghapus cookie yang dipilih.

Klik Hapus semua untuk menghapus semua cookie.

Menghapus semua cookie.

Mengidentifikasi dan memeriksa cookie pihak ketiga

Cookie pihak ketiga adalah cookie yang ditetapkan oleh situs yang berbeda dengan halaman tingkat atas saat ini. Cookie pihak ketiga memiliki atribut SameSite=None.

DevTools mencantumkan cookie tersebut di Application > Penyimpanan > Cookie dan menampilkan ikon peringatan peringatan di sampingnya. Arahkan kursor ke ikon tersebut untuk melihat tooltip, lalu klik ikon tersebut untuk membuka panel Masalah guna mengetahui informasi selengkapnya.

Cookie dengan atribut SameSite=None di bagian Storage.

Anda juga dapat menemukan cookie pihak ketiga di Network > klik permintaan > Cookie.

Cookie dengan atribut SameSite=None di panel Jaringan.

Panel Jaringan menandai cookie yang berisi masalah dan menampilkan ikon peringatan peringatan di samping cookie yang terpengaruh oleh penghentian cookie pihak ketiga.