Melihat, menambahkan, mengedit, dan menghapus cookie

Kayce Basques
Sofia Emelianova
Sofia Emelianova
GitHub

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

Membuka panel Cookies

  1. Buka Chrome DevTools.
  2. Buka Application > Storage > Cookies, 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 untuk 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 perubahan JavaScript tidak diizinkan.
  • Aman. Jika benar, kolom ini menunjukkan bahwa cookie hanya dapat dikirim ke server melalui koneksi HTTPS yang aman.
  • SameSite. Berisi Strict atau Lax jika cookie menggunakan atribut 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 atribut Prioritas cookie yang tidak digunakan lagi.

Untuk melihat nilai cookie, pilih cookie tersebut 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 lainnya secara otomatis. Anda dapat mengeditnya seperti yang dijelaskan di bawah.

Mengedit cookie

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

Klik dua kali kolom untuk mengeditnya.

Menetapkan nama cookie ke '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 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 dari halaman tingkat atas saat ini. Cookie pihak ketiga memiliki atribut SameSite=None.

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

Cookie dengan atribut SameSite=None di bagian Storage.

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

Cookie dengan atribut SameSite=None di panel Jaringan.

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