Penjelasan terperinci tentang kuki pengendalian JavaScript_Pengetahuan asas

Apakah itu Kuki

"Kuki ialah pembolehubah yang disimpan pada komputer pelawat. Kuki ini dihantar setiap kali komputer yang sama meminta halaman melalui penyemak imbas. Anda boleh menggunakan JavaScript untuk mencipta dan mendapatkan nilai kuki." - w3school

Kuki ialah fail yang dibuat oleh tapak web yang dilawati untuk menyimpan maklumat penyemakan imbas, seperti maklumat profil.

Dari perspektif JavaScript, kuki hanyalah beberapa maklumat rentetan. Maklumat ini disimpan dalam komputer klien dan digunakan untuk memindahkan maklumat antara komputer klien dan pelayan.

Maklumat ini boleh dibaca atau ditetapkan melalui document.cookie dalam JavaScript. Memandangkan kuki kebanyakannya digunakan untuk komunikasi antara klien dan pelayan, selain JavaScript, bahasa sebelah pelayan (seperti PHP) juga boleh mengakses kuki.

Asas Kuki

Kuki mempunyai had saiz Data yang disimpan dalam setiap kuki tidak boleh melebihi 4kb Jika panjang rentetan kuki melebihi 4kb, atribut ini akan mengembalikan rentetan kosong.

Memandangkan kuki akhirnya disimpan dalam komputer pelanggan dalam bentuk fail, adalah sangat mudah untuk melihat dan mengubah suai kuki Inilah sebabnya sering dikatakan bahawa kuki tidak boleh menyimpan maklumat penting.

Format setiap kuki adalah seperti ini: =; kedua-dua nama dan nilai mestilah pengecam yang sah.

Kuki mempunyai tarikh luput. Secara lalai, kitaran hayat kuki tamat apabila penyemak imbas ditutup. Jika anda mahu kuki boleh digunakan selepas penyemak imbas ditutup, anda mesti menetapkan tempoh sah untuk kuki, iaitu tarikh tamat tempoh kuki.

alert(typeof document.cookie) Hasilnya ialah rentetan saya pernah fikir ia adalah array dan membuat jenaka... 囧

Kuki mempunyai konsep domain dan laluan. Domain ialah konsep domain Oleh kerana pelayar adalah persekitaran yang mementingkan keselamatan, domain yang berbeza tidak boleh mengakses kuki antara satu sama lain (sudah tentu, akses merentas domain kepada kuki boleh dicapai melalui tetapan khas). Laluan ialah konsep penghalaan Kuki yang dibuat oleh halaman web hanya boleh diakses oleh semua halaman web dalam direktori atau subdirektori yang sama seperti halaman web ini, tetapi tidak boleh diakses oleh halaman web dalam direktori lain (ayat ini agak mengelirukan, saya akan lihat. at it later) Lebih mudah difahami dengan contoh).

Malah, cara membuat kuki agak serupa dengan cara mentakrifkan pembolehubah kedua-duanya memerlukan penggunaan nama kuki dan nilai kuki. Laman web yang sama boleh mencipta berbilang kuki dan berbilang kuki boleh disimpan dalam fail kuki yang sama.

Soalan Lazim Kuki

Terdapat dua jenis kuki:

Kuki yang ditetapkan oleh tapak web semasa yang anda semak imbas

Kuki pihak ketiga daripada sumber domain lain seperti iklan atau imej terbenam pada halaman web (tapak web boleh menjejaki maklumat penggunaan anda dengan menggunakan kuki ini)

Pengetahuan asas baru sahaja menyebut isu kitaran hayat kuki Sebenarnya, kuki boleh dibahagikan secara kasar kepada dua keadaan:

Kuki sementara. Tapak web akan menyimpan beberapa maklumat peribadi anda semasa penggunaan semasa, dan maklumat ini juga akan dipadamkan daripada komputer anda apabila penyemak imbas ditutup

Tetapkan kuki dengan masa tamat tempoh. Walaupun pelayar ditutup, maklumat ini masih akan berada pada komputer. Seperti nama log masuk dan kata laluan, jadi anda tidak perlu log masuk setiap kali anda pergi ke tapak tertentu. Kuki ini boleh kekal pada komputer anda selama beberapa hari, bulan atau bahkan bertahun-tahun

Terdapat dua cara untuk mengosongkan kuki:

Kosongkan kuki melalui alatan penyemak imbas (terdapat alat pihak ketiga dan penyemak imbas itu sendiri juga mempunyai fungsi ini)

Kosongkan kuki dengan menetapkan tarikh luputnya

Nota: Memadamkan kuki kadangkala boleh menyebabkan sesetengah halaman web tidak berfungsi dengan betul

Pelayar boleh ditetapkan untuk menerima dan menafikan akses kepada kuki.

Atas sebab fungsi dan prestasi, adalah disyorkan untuk mengurangkan bilangan kuki yang digunakan dan cuba menggunakan kuki kecil.

Butiran pengekodan kuki akan diperkenalkan secara berasingan dalam bab kuki lanjutan.

Jika ia adalah halaman pada cakera setempat, konsol Chrome tidak boleh menggunakan JavaScript untuk membaca dan menulis kuki Penyelesaiannya...tukar penyemak imbas^_^.

Penggunaan asas kuki

1. Operasi akses mudah

Apabila menggunakan JavaScript untuk mengakses kuki, anda mesti menggunakan atribut kuki objek Dokumen; satu baris kod menerangkan cara membuat dan mengubah suai kuki:

Salin kod Kod adalah seperti berikut:

document.cookie = 'nama pengguna=Darren';

Dalam kod di atas, 'nama pengguna' mewakili nama kuki, dan 'Darren' mewakili nilai yang sepadan dengan nama ini. Jika nama kuki tidak wujud, maka kuki baharu dibuat jika ia wujud, nilai yang sepadan dengan nama kuki diubah suai. Jika anda ingin membuat kuki beberapa kali, hanya gunakan kaedah ini berulang kali.

2. Operasi membaca kuki

Sebenarnya sangat mudah untuk membaca kuki dengan tepat, hanya beroperasi pada rentetan. Salin kod ini daripada w3school untuk analisis:

Salin kod Kod adalah seperti berikut:

fungsi getCookie(c_name){
　　jika (document.cookie.length>0){ 　　//Periksa dahulu sama ada kuki itu kosong, jika kosong, kembalikan ""
　　　c_start=document.cookie.indexOf(c_name "=")　//Semak sama ada kuki ini wujud melalui indexOf() objek String Jika ia tidak wujud, ia akan menjadi -1　
　　　jika (c_start!=-1){
　　　　c_start=c_start c_name.length 1　//1 yang terakhir sebenarnya mewakili nombor "=", supaya kedudukan permulaan nilai kuki diperoleh
c_end=document.cookie.indexOf(";",c_start) //Sebenarnya, saya agak pening ketika pertama kali melihat parameter kedua indexOf(). ayat adalah untuk Dapatkan kedudukan akhir nilai. Kerana kita perlu mempertimbangkan sama ada ia adalah item terakhir, kita boleh menilai sama ada tanda ";" wujud
　　　　jika (c_end==-1) c_end=document.cookie.length　
Kembalikan unescape(document.cookie.substring(c_start,c_end)) //Nilai diperoleh melalui substring(). Jika anda ingin memahami unescape(), anda mesti mengetahui apa yang dilakukan oleh escape() Ia adalah asas yang sangat penting artikel
　　　}
　　}
kembalikan ""
}　

Sudah tentu, terdapat banyak cara untuk membaca kuki, seperti tatasusunan, ungkapan biasa, dsb., jadi saya tidak akan menerangkan butiran di sini.

3. Tetapkan tempoh sah kuki

Kitaran hayat kuki yang sering muncul dalam artikel ialah tempoh sah dan tempoh tamat, iaitu masa kewujudan kuki. Secara lalai, kuki dikosongkan secara automatik apabila penyemak imbas ditutup, tetapi kami boleh menetapkan tempoh sah kuki sehingga tamat. Sintaksnya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

document.cookie = "name=value;expires=date";

Nilai tarikh dalam kod di atas ialah rentetan tarikh dalam format GMT (Greenwich Mean Time) dan dijana seperti berikut:

Salin kod Kod adalah seperti berikut:

var _date = new Date();
_date.setDate(_date.getDate() 30);
_date.toGMTString();

Tiga baris kod di atas dipecahkan kepada beberapa langkah:

Jana contoh Tarikh melalui baharu untuk mendapatkan masa semasa;

Kaedah getDate() mendapat hari tertentu dalam bulan tempatan semasa, dan kemudian menambah 30. Saya harap kuki ini boleh disimpan secara setempat selama 30 hari

Kemudian tetapkan masa melalui kaedah setDate()

Akhir sekali, gunakan kaedah toGMTString() untuk menukar objek Date menjadi rentetan dan mengembalikan hasilnya

Gunakan fungsi lengkap berikut untuk menggambarkan perkara yang perlu kita beri perhatian dalam proses mencipta kuki - disalin daripada w3school. Buat fungsi yang menyimpan maklumat dalam kuki:

Salin kod Kod adalah seperti berikut:

function setCookie(c_name, value, expiredays){
var exdate=New Date();
exdate.setDate(exdate.getDate() expiredays);
Document.cookie=c_name "=" escape(value) ((expiredays==null) ? "" : ";expires=" exdate.toGMTString());
}
//Penggunaan: setCookie('nama pengguna','Darren',30)

Sekarang fungsi kami menetapkan masa sah kuki mengikut bilangan hari Jika anda ingin menetapkannya dalam unit lain (seperti jam), kemudian tukar baris ketiga kod:

.

Salin kod Kod adalah seperti berikut:

exdate.setHours(exdate.getHours() expiredays);

Selepas menetapkan cara ini, tempoh sah kuki akan berdasarkan jam.

Terdapat dua kaedah untuk mengosongkan kuki yang disebut dalam Soalan Lazim Perkara yang akan kita bincangkan sekarang ialah membatalkan kuki dengan menetapkan tempoh sah kepada masa tamat. Sekarang sudah ada cara untuk menetapkan tempoh sah, rakan-rakan yang berminat diminta melakukannya sendiri ^_^. Mari teruskan dengan topik kuki yang lebih mendalam.

Bab Lanjutan Kuki

1. Konsep laluan kuki

Dalam pengetahuan asas, disebutkan bahawa kuki mempunyai konsep domain dan laluan Sekarang mari kita perkenalkan peranan laluan dalam kuki.

Kuki biasanya dibuat apabila pengguna melawat halaman, tetapi kuki ini bukan sahaja boleh diakses pada halaman tempat kuki itu dibuat.

Secara lalai, hanya halaman web dalam direktori atau subdirektori yang sama dengan halaman yang mencipta kuki boleh diakses Ini disebabkan oleh pertimbangan keselamatan, jadi tidak semua halaman boleh mengakses kuki yang dibuat oleh halaman lain secara bebas. Contohnya:

Buat kuki pada halaman "http://www.jb51.net/Darren_code/", kemudian halaman di bawah laluan "/Darren_code/" akan menjadi seperti: "http://www.jb51.net/ Darren_code /archive/2011/11/07/Cookie.html" Halaman ini boleh mendapatkan maklumat kuki secara lalai.

Secara lalai, "http://www.jb51.net" atau "http://www.jb51.net/xxxx/" tidak boleh mengakses kuki ini (melihat sahaja ia tidak berguna, amalan akan memberitahu kebenaran) ^_^).

Jadi cara untuk menjadikan kuki ini boleh diakses oleh direktori lain atau direktori induk boleh dicapai dengan menetapkan laluan kuki. Contohnya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

document.cookie = "name=value;path=path"
document.cookie = "name=value;expires=date;path=path"

Laluan dalam fon merah ialah laluan kuki Contoh yang paling biasa ialah meletakkan kuki dalam direktori, supaya tidak kira sub-halaman mana yang mencipta kuki, semua halaman boleh mengaksesnya:

Salin kod Kod adalah seperti berikut:

document.cookie = "name=Darren;path=/";

2. Konsep domain kuki

Path boleh menyelesaikan masalah mengakses kuki dalam domain yang sama Mari kita bercakap tentang masalah kuki merealisasikan akses antara domain yang sama. Sintaksnya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

document.cookie = "name=value;path=path;domain=domain";

Domain merah ialah nilai set domain kuki.

Sebagai contoh, "www.qq.com" dan "sports.qq.com" berkongsi nama domain yang berkaitan "qq.com". Jika kita mahu kuki di bawah "sports.qq.com" menjadi "www. qq. com" untuk mengakses, kita perlu menggunakan atribut domain kuki, dan menetapkan atribut laluan kepada "/". Contoh:

Salin kod Kod adalah seperti berikut:

document.cookie = "nama pengguna=Darren;path=/;domain=qq.com";

Nota: Ia mestilah akses antara domain yang sama Nilai domain tidak boleh ditetapkan kepada nama domain selain daripada domain utama.

3. Keselamatan kuki

Biasanya maklumat kuki menggunakan sambungan HTTP untuk memindahkan data Kaedah pemindahan ini mudah dilihat, jadi maklumat yang disimpan dalam kuki mudah dicuri. Jika kandungan yang dihantar dalam kuki adalah penting, penghantaran data yang disulitkan diperlukan.

Jadi nama atribut kuki ini ialah "secure", dan nilai lalainya kosong. Jika atribut kuki adalah selamat, maka data dipindahkan antaranya dan pelayan melalui HTTPS atau protokol selamat yang lain. Sintaksnya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

document.cookie = "nama pengguna=Darren;secure"

Menetapkan kuki untuk selamat hanya memastikan bahawa proses penghantaran data antara kuki dan pelayan disulitkan, dan fail kuki yang disimpan secara setempat tidak disulitkan. Jika anda mahu kuki tempatan disulitkan, anda perlu menyulitkan data itu sendiri.

Nota: Walaupun atribut selamat ditetapkan, ini tidak bermakna orang lain tidak dapat melihat maklumat kuki yang disimpan secara setempat pada mesin anda, jadi pada analisis akhir, jangan letak maklumat penting dalam kuki, 囧...

4. Butiran pengekodan kuki

Pada asalnya saya ingin memperkenalkan pengetahuan pengekodan kuki di bahagian Soalan Lazim, kerana jika anda tidak memahami perkara ini, masalah pengekodan sememangnya satu perangkap, jadi saya akan menerangkannya secara terperinci.

Apabila memasukkan maklumat kuki, simbol khas seperti ruang, titik bertitik dan koma tidak boleh disertakan secara umum, maklumat kuki disimpan dalam cara yang tidak dikodkan. Oleh itu, sebelum menetapkan maklumat kuki, anda mesti menggunakan fungsi escape() untuk mengekod maklumat nilai kuki, dan kemudian gunakan fungsi unescape() untuk menukar nilai semula apabila nilai kuki diperoleh. Contohnya, apabila menetapkan kuki:

Salin kod Kod adalah seperti berikut:

document.cookie = nama "=" melarikan diri (nilai);

Mari lihat ayat di dalam getCookie() yang disebut dalam penggunaan asas:

Salin kod Kod adalah seperti berikut:

kembalikan unescape(document.cookie.substring(c_start,c_end));

Dengan cara ini anda tidak perlu risau tentang maklumat kuki yang tidak betul kerana simbol khas yang muncul dalam nilai kuki.

Kod Peribadi

Salin kod Kod adalah seperti berikut:

/*Tetapkan Kuki*/

function setCookie(c_name, value, expiredays, path, domain, secure) {
var exdate = new Date(); //Dapatkan masa semasa　
exdate.setDate(exdate.getDate() expiredays); //Masa tamat tempoh　
document.cookie = c_name "=" //nama kuki
escape(value) //Encode cookie value
((hari tamat == null) ? "" : ";expires=" exdate.toGMTString()) //Tetapkan masa tamat tempoh
((path == null) ? '/' : ';path=' path) //Tetapkan laluan akses
((domain == null) ? '' : ';domain=' domain) //Tetapkan domain akses
((secure == null) ? '' : ';secure=' secure); //Tetapkan sama ada untuk menyulitkan
};
setCookie('test', 'name=sheng;sex=lelaki;lancer=dullbear', 30);
setCookie('bb', 'name=sheng;sex=lelaki', 30);

/*Dapatkan Kuki*/

fungsi getCookie(c_name, indeks) {
var cookies = document.cookie; //Dapatkan nilai kuki
var cookieLen = cookies.length; //Dapatkan panjang kuki
if (cookieLen > 0) { //Apabila kuki tidak kosong

var c_start = cookies.indexOf(c_name '='); //Cari nilai kuki dan nombor siri dalam kuki
if (c_start > -1) { //Apabila nilai kuki wujud
c_start = c_name.length 1; //Dapatkan nombor urutan permulaan nilai kuki

var c_end = cookies.indexOf(';', c_start); //Dapatkan nombor jujukan tamat nilai kuki
Jika (c_end == -1) { //Apabila kuki adalah yang terakhir
c_end = cookieLen; //Tetapkan nombor urutan akhir nilai kuki kepada panjang kuki
};

var cookieStr = unescape(cookies.substring(c_start, c_end)); //Dapatkan nilai kuki yang dinyahkodkan

var cookieObj = cookieStr.split(';'); //Pisah nilai kuki

indeks = ((index == null) ? 0 : indeks); // Tentukan sama ada indeks diluluskan nilai

var goalObj = cookieObj[index]; //susun indeks
var goalStr = goalObj.split('=');
var getcook = goalStr[1]; //Dapatkan nilai kuki yang diperlukan
Kembalikan getcook;
};
} lain {
Console.log('Halaman tiada kuki');
}
};

alert(getCookie('test', 0)); //Cetak nilai kuki pertanyaan