1. Avant-propos
Auparavant, lors de l'utilisation de cookies, ils fonctionnaient tous sous la forme de document.cookie. Même si la compatibilité était bonne, c'était gênant. Personnellement, j'aime fabriquer des roues, j'ai donc encapsulé une classe d'outils pour les cookies. Depuis longtemps, j'aime écrire du code, mais je n'aime pas vraiment les résumés de texte, ni n'aime écrire des choses fragmentaires. Il semble que je doive le changer.
2. Idées
(1) Comment encapsuler et quoi encapsuler
Comment encapsuler : utilisez du js natif pour l'encapsuler dans un outil, afin qu'il puisse être utilisé n'importe où. Encapsuler document.cookie est le meilleur moyen, et toutes les opérations sont basées sur document.cookie.
Comment l'encapsuler : Il peut exister sous la forme d'un objet et peut être implémenté à l'aide des méthodes getter & setter.
(2) Quelles méthodes sont encapsulées
get(), set(name, value, opts), remove(name), clear(), getCookies(), etc. Je pense personnellement qu'encapsuler autant de méthodes est suffisant pour utiliser des cookies.
3. Actions
(1) Comprendre les cookies. L'essence des cookies est les cookies HTTP. L'objet affiché sur le client est document.cookie. Pour plus d'informations, vous pouvez lire mon code ci-dessous et commenter
.
(2) Code ci-dessus : ces codes doivent être très intuitifs et peuvent être compressés avec le code du projet. Je pense que le commentaire d’ouverture ci-dessous est le point clé.
/*
* Cookie HTTP : stocke les informations de session
* Les noms et valeurs doivent être codés en RUL lors de leur transmission
* Les cookies sont liés au nom de domaine spécifié. Les cookies ne peuvent pas être partagés avec des domaines non locaux, mais les cookies peuvent être partagés du site principal vers des sous-sites
* Les cookies ont certaines restrictions : par exemple, IE6 et IE6- sont limités à 20 ; IE7 50 ; Opear 30... donc les cookies sont généralement définis en fonction des [must] besoins
* Le nom du cookie n'est pas sensible à la casse ; il est également recommandé d'encoder l'URL du cookie ; le chemin est un bon moyen de distinguer la livraison du cookie dans différentes circonstances avec un cookie de marque de sécurité
* Dans le cas du SSL, il est envoyé au serveur, mais pas en http. Il est recommandé de définir l'expiration, le domaine et le chemin des cookies ; chaque cookie fait moins de 4 Ko
* */
//Encapsuler les cookies à l'aide des méthodes getter et setter
(fonction (globale){
//Récupère l'objet cookie, exprimé sous forme d'objet
Fonction getCookiesObj(){
var cookies = {};
Si(document.cookie){
var objs = document.cookie.split('; ');
pour(var i dans objs){
var index = objs[i].indexOf('='),
nom = objs[i].substr(0, index),
valeur = objs[i].substr(index 1, objs[i].length
cookies[nom] = valeur ;
}
>
renvoyer les cookies ;
>
//Définir le cookie
Ensemble de fonctions (nom, valeur, options){
//opte maxAge, chemin, domaine, sécurisé
Si(nom && valeur){
var cookie = encodeURIComponent(name) '=' encodeURIComponent(value);
//Paramètres facultatifs
si (opt){
Si(opts.maxAge){
Cookie = '; max-age=' opts.maxAge;
}
Si(opts.path){
Cookie = '; chemin=' opts.chemin;
}
Si(opts.domain){
Cookie = ';domain=' opts.domain;
}
Si(opts.secure){
cookie = '; sécurisé';
}
}
document.cookie = cookie;
renvoyer le cookie ;
}autre{
return '';
>
>
//Obtenir un cookie
Fonction get(nom){
return decodeURIComponent(getCookiesObj()[name]) || null;
>
//Effacer un cookie
Fonction supprimer(nom){
if(getCookiesObj()[nom]){
document.cookie = nom '=; âge-max=0';
>
>
//Cookie 清除所有
fonction clear(){
var cookies = getCookiesObj();
pour (clé var dans les cookies){
document.cookie = clé '=; âge-max=0';
>
>
//获取所有cookies
fonction getCookies(nom){
return getCookiesObj();
>
//解决冲突
fonction noConflict(nom){
if(nom && type de nom === 'string'){
if(nom && fenêtre['cookie']){
window[nom] = window['cookie'];
supprimer la fenêtre['cookie'];
fenêtre de retour[nom];
>
}autre{
fenêtre de retour['cookie'];
supprimer la fenêtre['cookie'];
>
>
global['cookie'] = {
'getCookies' : getCookies,
'ensemble' : ensemble,
'obtenir' : obtenir,
'supprimer' : supprimer,
'clair' : clair,
'noConflict' : noConflict
};
})(fenêtre);
(3)exemple
exemple de cookie
(4)代码地址:https://github.com/vczero/cookie