1. Pendahuluan
Sebelumnya, cookie digunakan dalam bentuk dokumen. Cookies. Meskipun kompatibilitasnya bagus, itu merepotkan. Saya adalah orang yang lebih suka membuat roda, jadi saya merangkum alat untuk cookie. Untuk waktu yang lama, saya suka menulis kode, tetapi tidak terlalu suka merangkum teks, saya juga tidak suka menulis beberapa hal yang terpisah. Sepertinya saya harus mengubahnya.
2. Ide
(1) Cara merangkum dan apa yang harus dirangkum
Cara merangkum: Ini adalah menggunakan JS asli untuk merangkumnya menjadi alat, sehingga dapat digunakan di mana saja. Enkapsulasi terhadap Document.cookie adalah cara terbaik untuk melakukannya, dan semua operasi didasarkan pada Document.cookie.
Apa yang dienkapsulasi: dienkapsulasi untuk ada sebagai objek, dan dapat diimplementasikan menggunakan metode Getter & Setter.
(2) metode enkapsulasi apa
get (), atur (nama, nilai, opts), hapus (nama), clear (), getCookies (), dll. Saya pribadi berpikir bahwa merangkum begitu banyak metode sudah cukup untuk menggunakan cookie.
3. Aksi
(1) Memahami cookie. Inti dari cookie adalah cookie http. Document.cookie Ketika objek yang diwakili oleh klien adalah dokumen. Untuk informasi lebih lanjut, Anda dapat membaca kode dan komentar berikut
(2) Kode di atas: Kode -kode ini harus sangat intuitif dan dapat dikompresi bersama dengan kode proyek. Saya pikir komentar di awal berikut adalah poin utama.
Salinan kode adalah sebagai berikut:
/*
* Cookie HTTP: Informasi Sesi Store
* Nama dan nilai harus dikodekan saat mentransmisikan
* Cookie terikat pada nama domain yang ditentukan. Cookie tidak dapat dibagikan tanpa domain ini, tetapi mereka dapat berbagi cookie ke gardu di situs utama.
* Cookie memiliki beberapa batasan: misalnya, IE6 & IE6 terbatas hingga 20; IE7 50; Opera 30 ... jadi cookie biasanya ditetapkan sesuai dengan persyaratan [harus]
* Nama cookie bebas kasus; Juga disarankan untuk mengkodekan URL cookie; Jalan adalah cara yang baik untuk membedakan cookie dalam situasi yang berbeda; cookie dengan bendera keamanan
* Kirim ke server dalam kasus SSL, tetapi HTTP tidak akan. Disarankan untuk mengatur kedaluwarsa, domain, dan jalur untuk cookie; Setiap cookie kurang dari 4kb.
* *//
// Untuk enkapsulasi cookie, gunakan metode Getter and Setter untuk mengadopsi metode Getter and Setter
(function (global) {
// Dapatkan objek cookie, dinyatakan sebagai objek
fungsi getCookiesObj () {
var cookies = {};
if (document.cookie) {
var objs = document.cookie.split (';');
untuk (var i di objs) {
var index = objs [i] .indexOf ('='),
name = objs [i] .substr (0, index),
value = objs [i] .substr (index + 1, objs [i] .length);
cookie [name] = value;
}
}
Kembali Cookie;
}
// Atur cookie
set fungsi (name, value, opts) {
// Memilih Maxage, Path, Domain, Aman
if (name && value) {
var cookie = encodeuricomponent (name) + '=' + encodeuricomponent (value);
// Parameter opsional
if (opts) {
if (opts.maxage) {
cookie += '; Max-AGe = ' + opts.maxage;
}
if (opts.path) {
cookie += '; path = ' + opts.path;
}
if (opts.domain) {
cookie += '; domain = ' + opts.domain;
}
if (opts.secure) {
cookie += '; aman';
}
}
document.cookie = cookie;
Kembali Cookie;
}kalau tidak{
kembali '';
}
}
// Dapatkan cookie
fungsi get (name) {
return decodeuricomponent (getCookiesObj () [name]) || batal;
}
// Bersihkan cookie
fungsi hapus (name) {
if (getCookiesObj () [name]) {
document.cookie = name + '=; Max-Age = 0 ';
}
}
// Bersihkan semua cookie
function clear () {
var cookies = getCookiesObj ();
untuk (tombol var dalam cookie) {
document.cookie = key + '=; Max-Age = 0 ';
}
}
// Dapatkan semua cookie
fungsi getCookies (name) {
return getCookiesObj ();
}
// menyelesaikan konflik
fungsi noconflict (name) {
if (name && typeof name === 'string') {
if (name && window ['cookie']) {
window [name] = window ['cookie'];
hapus jendela ['cookie'];
return window [name];
}
}kalau tidak{
return window ['cookie'];
hapus jendela ['cookie'];
}
}
global ['cookie'] = {
'getCookies': getCookies,
'Set': set,
'dapatkan': dapatkan,
'hapus': hapus,
'jelas': jelas,
'Noconflict': noconflict
};
})(jendela);
(3) Contoh
Salinan kode adalah sebagai berikut:
<! Doctype html>
<Html>
<head>
<meta charset = "UTF-8">
<Title> contoh cookie </iteme>
</head>
<body>
<script type = "text/javascript" src = "cookie.js">/script>
<type skrip = "Teks/JavaScript">
Console.log ('--------------------------------------------------------);
console.log (cookie);
Console.log ('------------------------------------------------------------------------------------------------------------------------------
console.log (cookie.getcookies ());
Console.log ('--------------------------------------------------------------);
console.log (cookie.set ('name', 'wlh'));
Console.log ('-------------------------------------------------------------------);
console.log (cookie.set ('name', 'wlh123'));
Console.log ('-------------------------------------------------------------------------);
console.log (cookie.set ('usia', 20));
Console.log ('----------------------------------------------------------);
console.log (cookie.get ('name'));
Console.log ('---------------------------------------------------------------------);
console.log (cookie.getcookies ());
Console.log ('-------------------------------------------------------------------);
console.log (cookie.remove ('usia'));
Console.log ('---------------------------------------------------------------------);
console.log (cookie.getcookies ());
Console.log ('---------------------------------------------------------------------);
console.log (cookie.clear ());
Console.log ('---------------------------------------------------------------------);
console.log (cookie.getcookies ());
Console.log ('---------------------------------------------------------------------);
var $ cookie = cookie.noconflict (true /*nama baru cookie* /);
console.log ($ cookie);
Console.log ('-----------------------------------------------------------------);
console.log ($ cookie.getCookies ());
</script>
</body>
</html>
(4) Alamat kode: https://github.com/vczero/cookie