1. Préface
Avant, des cookies étaient utilisés sous forme de document.cookies. Bien que la compatibilité soit bonne, elle est gênante. Je suis une personne qui préfère faire des roues, donc je résume un outil pour les cookies. Pendant longtemps, j'aime écrire du code, mais je n'aime pas beaucoup résumer les textes, et j'aime écrire des choses fragmentaires. Il semble que je dois le changer.
2. Idées
(1) comment encapsuler et quoi encapsuler
Comment encapsuler: il s'agit d'utiliser JS natif pour le encapsuler dans un outil, afin qu'il puisse être utilisé n'importe où. Encapsulation contre document.cookie est le meilleur moyen de le faire, et toutes les opérations sont basées sur document.cookie.
Ce qui est encapsulé: encapsulé pour exister en tant qu'objet et peut être implémenté à l'aide de la méthode Getter & Setter.
(2) Quelles méthodes d'encapsulation
get (), set (nom, valeur, opts), supprimer (nom), clear (), getcookies (), etc. Je pense personnellement que le résumer tant de méthodes est suffisant pour utiliser des cookies.
3. Action
(1) Comprendre les cookies. L'essence des cookies est les cookies HTTP. Document.cookie Lorsque l'objet représenté par le client est un document. Pour plus d'informations, vous pouvez lire le code suivant et commenter
(2) Le code ci-dessus: ces codes doivent être très intuitifs et peuvent être compressés avec le code de projet. Je pense que les commentaires au début des points suivants sont les points clés.
La copie de code est la suivante:
/ *
* Cookies HTTP: Informations sur la session de stockage
* Le nom et la valeur doivent être entièrement réglés lors de la transmission
* Le cookie est lié au nom de domaine spécifié. Les cookies ne peuvent pas être partagés sans ce domaine, mais ils peuvent partager des cookies avec des sous-stations sur le site principal.
* Les cookies ont quelques restrictions: par exemple, IE6 & IE6-Limited à 20; IE7 50; Opéra 30 ... Les cookies sont donc généralement définis en fonction des exigences de [MUST]
* Le nom du cookie est sans cas; Il est également recommandé de coder l'URL des cookies; Le chemin est un bon moyen de distinguer les cookies dans différentes situations; le cookie avec le drapeau de sécurité
* Envoyez au serveur dans le cas SSL, mais HTTP ne le fera pas. Il est recommandé de définir l'expiration, le domaine et le chemin des cookies; Chaque cookie est inférieur à 4 Ko.
* * /
// Pour l'encapsulation des cookies, utilisez des méthodes Getter et Setter pour adopter des méthodes Getter et Setter
(fonction (global) {
// Obtenez l'objet cookie, exprimé en tant qu'objet
fonction getcookiesoBj () {
var cookies = {};
if (document.cookie) {
var objs = document.cookie.split (';');
pour (var i dans objs) {
var index = objs [i] .indexof ('='),
name = objs [i] .substr (0, index),
valeur = objs [i] .substr (index + 1, objs [i] .length);
cookies [name] = valeur;
}
}
retourner des cookies;
}
// définir des cookies
Set de fonction (nom, valeur, opts) {
// opte maxage, chemin, domaine, sécurisé
if (name && value) {
var cookie = encodeuRIComponent (name) + '=' + EncodeuRIComponent (valeur);
// Paramètres facultatifs
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 + = '; sécurisé';
}
}
document.cookie = cookie;
retourner cookie;
}autre{
retour '';
}
}
// Obtenez des cookies
fonction get (name) {
return decodeuriComponent (getcookiesoBj () [name]) || nul;
}
// effacer un cookie
fonction supprime (name) {
if (getcookiesoBj () [name]) {
document.cookie = name + '=; max-age = 0 ';
}
}
// effacer tous les cookies
fonction clear () {
var cookies = getcookiesoBj ();
pour (clé var dans les cookies) {
document.cookie = key + '=; max-age = 0 ';
}
}
// Obtenez tous les cookies
fonction getcookies (name) {
return getcookiesObj ();
}
// résoudre le conflit
fonction noconflict (name) {
if (name && typeof name === 'string') {
if (name && fenêtre ['cookie']) {
fenêtre [name] = fenêtre ['cookie'];
supprimer la fenêtre ['cookie'];
fenêtre de retour [name];
}
}autre{
fenêtre de retour ['cookie'];
supprimer la fenêtre ['cookie'];
}
}
global ['cookie'] = {
'getcookies': getcookies,
'set': set,
'Get': Get,
«Retirer»: supprimer,
'Clear': clair,
'Noconflict': Noconflict
};
})(fenêtre);
(3) exemple
La copie de code est la suivante:
<! Doctype html>
<html>
<adal>
<meta charset = "utf-8">
<Title> Exemple de cookie </TITME>
</ head>
<body>
<script type = "text / javascript" src = "cookie.js"> / script>
<script type = "text / 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 («âge», 20));
console.log ('----------------------------------------------------------);
console.log (cookie.get ('name'));
console.log ('----------------------------------------------------------------);
console.log (cookie.getcookies ());
console.log ('-------------------------------------------------------------------);
Console.log (Cookie.Remove («Age»));
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 / * un nouveau nom de cookie * /);
Console.log ($ cookie);
console.log ('-----------------------------------------------------------------);
console.log ($ cookie.getcookies ());
</cript>
</docy>
</html>
(4) Adresse du code: https://github.com/vczero/cookie