Leitfaden zur Cookie-Kapselung und -Nutzung, erstellt von javascript_javascript skills

1. Vorwort

Bisher wurden Cookies alle in der Form document.cookie betrieben. Obwohl die Kompatibilität gut war, war dies problematisch. Da ich persönlich gerne Räder herstelle, habe ich eine Werkzeugklasse für Kekse gekapselt. Ich habe schon lange gerne Code geschrieben, aber ich mag weder Textzusammenfassungen noch schreibe ich fragmentarische Dinge. Es scheint, dass ich ihn ändern muss.

2. Ideen

(1) Wie man kapselt und was man kapselt

So kapseln Sie es: Verwenden Sie natives js, um es in ein Tool zu kapseln, sodass es überall verwendet werden kann. Die Kapselung von document.cookie ist der beste Weg, und alle Vorgänge basieren auf document.cookie.

So kapseln Sie es: Es kann in Form eines Objekts vorliegen und mithilfe von Getter- und Setter-Methoden implementiert werden.

(2) Welche Methoden sind gekapselt

get(), set(name, value, opts), remove(name), clear(), getCookies() usw. Ich persönlich denke, dass die Kapselung so vieler Methoden ausreicht, um Cookies zu verwenden.

3. Aktion

(1) Cookies verstehen: Das auf dem Client angezeigte Objekt ist document.cookie. Für weitere Informationen können Sie meinen Code unten lesen und kommentieren

(2) Obiger Code: Diese Codes sollten sehr intuitiv sein und können zusammen mit dem Projektcode komprimiert werden. Ich denke, der Eröffnungskommentar unten ist der entscheidende Punkt.

Code kopieren Der Code lautet wie folgt:

/*
* HTTP-Cookie: speichert Sitzungsinformationen
* Namen und Werte müssen bei der Übertragung RUL-codiert sein
* Cookies sind an den angegebenen Domänennamen gebunden. Cookies können nicht mit nicht-lokalen Domänen geteilt werden, Cookies können jedoch von der Hauptseite an Unterseiten weitergegeben werden
* Für Cookies gelten einige Einschränkungen: Beispielsweise sind IE6 und IE6 auf 20 beschränkt. Daher werden Cookies im Allgemeinen entsprechend den Anforderungen festgelegt
* Beim Namen des Cookies muss die Groß-/Kleinschreibung nicht beachtet werden; es wird außerdem empfohlen, den Pfad zu kodieren, um die Cookie-Zustellung unter verschiedenen Umständen mit einem Sicherheitsmarkierungs-Cookie zu unterscheiden * Im Fall von SSL wird es an den Server gesendet, jedoch nicht in http. Es wird empfohlen, Ablaufdatum, Domäne und Pfad für Cookies festzulegen; jedes Cookie ist kleiner als 4 KB
* */
//Cookies mit Getter- und Setter-Methoden kapseln
(Funktion(global){
//Holen Sie sich das Cookie-Objekt, ausgedrückt als Objekt
Funktion getCookiesObj(){
        var Cookies = {};
If(document.cookie){
            var objs = document.cookie.split('; ');
for(var i in objs){
              var index = objs[i].indexOf('='),
name = objs[i].substr(0, index),
value = objs[i].substr(index 1, objs[i].length);                   Cookies[Name] = Wert;
            }
}
         Cookies zurückgeben;
}
//Cookie setzen
Funktionssatz (Name, Wert, Optionen){
​​​​ //opts maxAge, path, domain, secure
If(name && value){
               var cookie = encodeURIComponent(name) '=' encodeURIComponent(value);
​​​​​​ //Optionale Parameter
                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 = '; secure';                 }
            }
                 document.cookie = cookie;
               Cookie zurückgeben;
         }sonst{
              return '';
}
}
//Cookie holen
Funktion get(name){
          return decodeURIComponent(getCookiesObj()[name]) || null;
}
//Ein Cookie löschen
Funktion „remove(name){
“.        if(getCookiesObj()[name]){
            document.cookie = name '=; max-age=0';
        }
    }
    //清除所有cookie
    Funktion klar(){
        var Cookies = getCookiesObj();
        for(var-Schlüssel in Cookies){
            document.cookie = key '=; max-age=0';
        }
    }
    //获取所有cookies
    Funktion getCookies(name){
        return getCookiesObj();
    }
    //解决冲突
    Funktion noConflict(name){
        if(name && typeof name === 'string'){
            if(name && window['cookie']){
                window[name] = window['cookie'];
                Fenster['Cookie'] löschen;
                return window[name];
            }
        }else{
            return window['cookie'];
            Fenster['Cookie'] löschen;
        }
    }
    global['cookie'] = {
        'getCookies': getCookies,
        'set': set,
        'get': get,
        'remove': entfernen,
        'clear': klar,
        'noConflict': noConflict
    };
})(Fenster);

 （3）Beispiel

复制代码 代码如下:

<!DOCTYPE html>
<html>
    <tête>
        <meta charset="utf-8">
        <title>exemple de cookie</title>
    </tête>
    <corps>
        <script type="text/javascript" src="cookie.js" ></script>
        <script type="text/javascript">
            console.log('---------cookie对象-------------');
            console.log(cookie);
            console.log('---------对象-------------');
            console.log(cookie.getCookies());
            console.log('----------设置cookie-------------');
            console.log(cookie.set('name', 'wlh'));
            console.log('---------设置cookie 123-------------');
            console.log(cookie.set('name', 'wlh123'));
            console.log('----------设置âge du cookie-------------');
            console.log(cookie.set('age', 20));
            console.log('---------获取cookie-------------');
            console.log(cookie.get('name'));
            console.log('---------获取所有-------------');
            console.log(cookie.getCookies());
            console.log('----------清除age-------------');
            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());
        </script>
    </corps>
</html>

(4)代码地址：https://github.com/vczero/cookie