Cara menggunakan cookie set javascript selamanya

Question

Properti

document.cookie = newCookie;

7

document.cookie = newCookie;

8 memungkinkan Anda membaca dan menulis cookie yang terkait dengan dokumen. Ini berfungsi sebagai pengambil dan penyetel nilai sebenarnya dari cookie

Table of Contents Show

allCookies = document.cookie;

Dalam kode di atas

document.cookie = newCookie;

_9 adalah string yang berisi daftar semua cookie yang dipisahkan titik koma (i. e.

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_0 pasang). Perhatikan bahwa setiap kunci dan nilai dapat diapit oleh spasi putih (karakter spasi dan tab). sebenarnya, RFC 6265 mengamanatkan satu spasi setelah setiap titik koma, tetapi beberapa agen pengguna mungkin tidak mematuhi ini

document.cookie = newCookie;

Pada kode di atas,

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_1 adalah rangkaian bentuk

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

0. Perhatikan bahwa Anda hanya dapat mengatur/memperbarui satu cookie pada satu waktu menggunakan metode ini. Juga pertimbangkan itu

Salah satu dari nilai atribut cookie berikut secara opsional dapat mengikuti pasangan kunci-nilai, menentukan cookie untuk disetel/diperbarui, dan didahului oleh pemisah titik koma

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_3 (mis. g. , '

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

4', '

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

5') Jika tidak ditentukan, default ke jalur saat ini dari lokasi dokumen saat ini

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_6 (mis. g. , '

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_7' atau '

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

8'). Jika tidak ditentukan, ini default ke bagian host dari lokasi dokumen saat ini. Bertentangan dengan spesifikasi sebelumnya, titik awal dalam nama domain diabaikan, tetapi browser dapat menolak untuk menyetel cookie yang berisi titik tersebut. Jika domain ditentukan, subdomain selalu disertakan

Catatan. Domain harus cocok dengan domain asal JavaScript. Menyetel cookie ke domain asing akan diabaikan secara diam-diam

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_9 (mis. g. ,

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

0 atau 31536000 selama setahun)

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

1 Jika

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

2 atau

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

3 tidak ditentukan, itu akan kedaluwarsa pada akhir sesi

Peringatan. Saat privasi pengguna menjadi perhatian, implementasi aplikasi web apa pun harus membatalkan data cookie setelah waktu tunggu tertentu alih-alih mengandalkan browser untuk melakukannya. Banyak browser membiarkan pengguna menentukan bahwa cookie tidak boleh kedaluwarsa, yang belum tentu aman

Lihat

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

_4 untuk membantu memformat nilai ini

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

5 Cookie hanya dikirimkan melalui protokol aman sebagai https. Sebelum Chrome 52, flag ini dapat muncul dengan cookie dari domain http

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

6 mencegah browser mengirimkan cookie ini bersama dengan permintaan lintas situs. Nilai yang mungkin adalah

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

_7,

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

8 atau

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

9

Nilai
```
<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>
```
_7 akan mengirimkan cookie untuk semua permintaan situs yang sama dan permintaan GET navigasi tingkat atas. Ini cukup untuk pelacakan pengguna, tetapi akan mencegah banyak serangan Cross-Site Request Forgery (CSRF). Ini adalah nilai default di browser modern

Nilai

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

_8 akan mencegah cookie dikirim oleh browser ke situs target dalam semua konteks penjelajahan lintas situs, bahkan saat mengikuti tautan biasa

Nilai

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

_9 secara eksplisit menyatakan tidak ada batasan yang akan diterapkan. Cookie akan dikirim dalam semua permintaan—baik lintas situs maupun situs yang sama

String nilai cookie dapat menggunakan

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

_3 untuk memastikan bahwa string tidak berisi koma, titik koma, atau spasi (yang tidak diperbolehkan dalam nilai cookie)

Beberapa implementasi agen pengguna mendukung awalan cookie berikut

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

4 Sinyal ke browser bahwa browser hanya boleh menyertakan cookie dalam permintaan yang dikirim melalui saluran aman

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

5 Sinyal ke browser bahwa selain pembatasan untuk hanya menggunakan cookie dari sumber yang aman, ruang lingkup cookie terbatas pada atribut jalur yang diturunkan oleh server. Jika server menghilangkan atribut jalur, "direktori" dari URI permintaan digunakan. Ini juga menandakan bahwa atribut domain tidak boleh ada, yang mencegah cookie dikirim ke domain lain. Untuk Chrome, atribut path harus selalu asal

Catatan. Tanda hubung dianggap sebagai bagian dari awalan

Catatan. Bendera ini hanya dapat disetel dengan atribut

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

6

Catatan. Seperti yang Anda lihat dari kode di atas,

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

7 adalah dengan fungsi penyetel dan pengambil asli, dan akibatnya bukan dengan nilai. apa yang Anda tulis tidak sama dengan apa yang Anda baca, semuanya selalu dimediasi oleh juru bahasa JavaScript

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "name=oeschger; SameSite=None; Secure";
document.cookie = "favorite_food=tripe; SameSite=None; Secure";

function showCookies() {
  const output = document.getElementById('cookies')
  output.textContent = `> ${document.cookie}`
}

function clearOutputCookies() {
  const output = document.getElementById('cookies')
  output.textContent = ''
}

_

<button onclick="showCookies()">Show cookies</button>

<button onclick="clearOutputCookies()">Clear</button>

<div>
  <code id="cookies"></code>
</div>

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

<button onclick="showCookieValue()">Show cookie value</button>

<button onclick="clearOutputCookieValue()">Clear</button>

<div>
  <code id="cookie-value"></code>
</div>

Untuk menggunakan kode berikut, silakan ganti semua kemunculan kata

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

8 (nama cookie) dengan nama kustom

function doOnce() {
  if (!document.cookie.split('; ').find((row) => row.startsWith('doSomethingOnlyOnce'))) {
    // Note that we are setting `SameSite=None;` in this example because the example
    // needs to work cross-origin.
    // It is more common not to set the `SameSite` attribute, which results in the default,
    // and more secure, value of `SameSite=Lax;`
    document.cookie = "doSomethingOnlyOnce=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; SameSite=None; Secure";

    const output = document.getElementById('do-once')
    output.textContent = '> Do something here!'
  }
}

function clearOutputDoOnce() {
  const output = document.getElementById('do-once')
  output.textContent = ''
}

<button onclick="doOnce()">Only do something once</button>

<button onclick="clearOutputDoOnce()">Clear</button>

<div>
  <code id="do-once"></code>
</div>

function resetOnce() {
  // Note that we are setting `SameSite=None;` in this example because the example
  // needs to work cross-origin.
  // It is more common not to set the `SameSite` attribute, which results in the default,
  // and more secure, value of `SameSite=Lax;`
  document.cookie = "doSomethingOnlyOnce=; expires=Thu, 01 Jan 1970 00:00:00 GMT; SameSite=None; Secure";

  const output = document.getElementById('reset-once')
  output.textContent = '> Reset!'
}

function clearOutputResetOnce() {
  const output = document.getElementById('reset-once')
  output.textContent = ''
}

<button onclick="resetOnce()">Reset only once cookie</button>

<button onclick="clearOutputResetOnce()">Clear</button>

<div>
  <code id="reset-once"></code>
</div>

document.cookie = newCookie;

0

document.cookie = newCookie;

_1

document.cookie = newCookie;

_2

document.cookie = newCookie;

_3

Penting untuk dicatat bahwa atribut

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}

_9 tidak melindungi dari pembacaan cookie yang tidak sah dari jalur yang berbeda. Itu dapat dengan mudah dilewati menggunakan DOM, misalnya dengan membuat elemen

<button onclick="showCookieValue()">Show cookie value</button>

<button onclick="clearOutputCookieValue()">Clear</button>

<div>
  <code id="cookie-value"></code>
</div>

0 tersembunyi dengan jalur cookie, lalu mengakses properti

<button onclick="showCookieValue()">Show cookie value</button>

<button onclick="clearOutputCookieValue()">Clear</button>

<div>
  <code id="cookie-value"></code>
</div>

1 iframe ini. Satu-satunya cara untuk melindungi cookie adalah dengan menggunakan domain atau subdomain yang berbeda, karena kebijakan asal yang sama

Cookie sering digunakan dalam aplikasi web untuk mengidentifikasi pengguna dan sesi yang diautentikasi. Mencuri cookie dari aplikasi web mengarah pada pembajakan sesi pengguna yang diautentikasi. Cara umum untuk mencuri cookie termasuk menggunakan rekayasa sosial atau dengan mengeksploitasi kerentanan cross-site scripting (XSS) dalam aplikasi -

document.cookie = newCookie;

_4

Atribut cookie

<button onclick="showCookieValue()">Show cookie value</button>

<button onclick="clearOutputCookieValue()">Clear</button>

<div>
  <code id="cookie-value"></code>
</div>

2 dapat membantu mengurangi serangan ini dengan mencegah akses ke nilai cookie melalui JavaScript. Baca lebih lanjut tentang Cookie dan Keamanan

Dimulai dengan Firefox 2, tersedia mekanisme yang lebih baik untuk penyimpanan sisi klien - WHATWG DOM Storage
Anda dapat menghapus cookie dengan memperbarui waktu kedaluwarsanya menjadi nol
Ingatlah bahwa semakin banyak cookie yang Anda miliki, semakin banyak data yang akan ditransfer antara server dan klien untuk setiap permintaan. Ini akan membuat setiap permintaan lebih lambat. Sangat disarankan bagi Anda untuk menggunakan WHATWG DOM Storage jika Anda ingin menyimpan data "khusus klien"
RFC 2965 (Bagian 5. 3, "Implementation Limits") menetapkan bahwa tidak boleh ada panjang maksimum dari ukuran kunci atau nilai cookie, dan mendorong implementasi untuk mendukung cookie besar yang sewenang-wenang. Implementasi maksimum setiap browser pasti akan berbeda, jadi bacalah dokumentasi masing-masing browser

Alasan properti pengakses

// Note that we are setting `SameSite=None;` in this example because the example
// needs to work cross-origin.
// It is more common not to set the `SameSite` attribute, which results in the default,
// and more secure, value of `SameSite=Lax;`
document.cookie = "test1=Hello; SameSite=None; Secure";
document.cookie = "test2=World; SameSite=None; Secure";

const cookieValue = document.cookie
  .split('; ')
  .find((row) => row.startsWith('test2='))
  ?.split('=')[1];

function showCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = `> ${cookieValue}`
}

function clearOutputCookieValue() {
  const output = document.getElementById('cookie-value')
  output.textContent = ''
}