Question

我正在为我构建的页面设置一个包含一些查询字符串值的cookie，这样当您重新访问该页面时，您将为您设置选项。

因此，如果网址为http://mysite.com/index.php?setting1=blue&orientation=horizontal&background=paper，则Cookie会存储setting1=blue，orientation=horizontal和background=paper值，以便在下次访问时回读。

似乎大多数人建议json在存储到cookie之前编码这些值。但是，当json编码与仅以标准查询字符串格式保存这些值并稍后解析它们时，我会获得更大的cookie大小（比如大4-5倍！）。

针对这种情况的最佳做法是什么？

Answer 1

查询字符串格式很好，如果你很容易解析它们。

Answer 2

好吧，如果你正在使用MooTools，只需使用Hash.Cookie，这很漂亮，可以通过抽象这个愚蠢的cookie存储东西来摆脱你的头痛：）

Answer 3

如果要将查询字符串转换为对象，请查看

myQueryString.parseQueryString（）//返回键值对的对象

需要mooTools更多字符串：http://mootools.net/docs/more/Types/String.QueryString

但是我更喜欢Base64的想法！见下文

此信用归功于瑞安佛罗伦萨，但这是我使用的：

var cookieData = DATATOENCODE.toBase64() // base64 encodes the data

cookieData.decodeBase64() // to decode it

神奇：

/*
---

script: Base64.js

description: String methods for encoding and decoding Base64 data

license: MIT-style license.

authors: Ryan Florence (http://ryanflorence.com), webtoolkit.info

requires:
- core:1.2.4: [String]

provides: [String.toBase64, String.decodeBase64]

...
*/


(function(){

    // Base64 string methods taken from http://www.webtoolkit.info/
    var Base64 = {

    _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

        encode : function (input) {
            var output = "";
            var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
            var i = 0;
            input = Base64._utf8_encode(input);
            while (i < input.length) {
                chr1 = input.charCodeAt(i++);
                chr2 = input.charCodeAt(i++);
                chr3 = input.charCodeAt(i++);
                enc1 = chr1 >> 2;
                enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
                enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
                enc4 = chr3 & 63;
                if (isNaN(chr2)) {
                    enc3 = enc4 = 64;
                } else if (isNaN(chr3)) {
                    enc4 = 64;
                };
                output = output +
                this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
                this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
            };
            return output;
        },

        decode : function (input) {
            var output = "";
            var chr1, chr2, chr3;
            var enc1, enc2, enc3, enc4;
            var i = 0;
            input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
            while (i < input.length) {
                enc1 = this._keyStr.indexOf(input.charAt(i++));
                enc2 = this._keyStr.indexOf(input.charAt(i++));
                enc3 = this._keyStr.indexOf(input.charAt(i++));
                enc4 = this._keyStr.indexOf(input.charAt(i++));
                chr1 = (enc1 << 2) | (enc2 >> 4);
                chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                chr3 = ((enc3 & 3) << 6) | enc4;
                output = output + String.fromCharCode(chr1);
                if (enc3 != 64) {
                    output = output + String.fromCharCode(chr2);
                };
                if (enc4 != 64) {
                    output = output + String.fromCharCode(chr3);
                };
            };
            output = Base64._utf8_decode(output);
            return output;
        },

        // private method for UTF-8 encoding
        _utf8_encode : function (string) {
            string = string.replace(/\r\n/g,"\n");
            var utftext = "";
            for (var n = 0; n < string.length; n++) {
                var c = string.charCodeAt(n);
                if (c < 128) {
                    utftext += String.fromCharCode(c);
                } else if((c > 127) && (c < 2048)) {
                    utftext += String.fromCharCode((c >> 6) | 192);
                    utftext += String.fromCharCode((c & 63) | 128);
                } else {
                    utftext += String.fromCharCode((c >> 12) | 224);
                    utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                    utftext += String.fromCharCode((c & 63) | 128);
                };

            };
            return utftext;
        },


        _utf8_decode : function (utftext) {
            var string = "";
            var i = 0;
            var c = c1 = c2 = 0;
            while ( i < utftext.length ) {
                c = utftext.charCodeAt(i);
                if (c < 128) {
                    string += String.fromCharCode(c);
                    i++;
                } else if((c > 191) && (c < 224)) {
                    c2 = utftext.charCodeAt(i+1);
                    string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                    i += 2;
                } else {
                    c2 = utftext.charCodeAt(i+1);
                    c3 = utftext.charCodeAt(i+2);
                    string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                    i += 3;
                };
            };
            return string;
        }

    };

    String.implement({
        toBase64: function(){
            return Base64.encode(this);
        },

        decodeBase64: function(){
            return Base64.decode(this);
        }
    });

})();

Answer 4

我不知道是否有最佳做法，但我建议使用查询字符串格式，因为它更小。

Cookie随每个页面请求一起传输。传输的数据越少越好。

Answer 5

如果它们更大，你可能做错了什么。 setting1=blue可以表示为{"setting1":"blue"} - 添加orientation=horizontal会{"setting1":"blue","orientation":"horizontal"} - 它肯定会占用更多的空间而不是那么多。

另外，我个人建议不要使用JSON。来自不同网站的攻击者在您的域上设置cookie然后可以作为JSON执行，这太容易了。如果您只进行密钥/值存储，NVP“编码”会更有效。

如何编码cookie数据

5 个答案: