Javascript getCookie函数

Question

我找到了两个使用Javascript获取cookie数据的函数,一个在w3schools.com上,一个在quirksmode.org上
我想知道我应该使用哪一个？

例如,我相信我在某处看到某些浏览器分裂;分号存在问题？

W3Schools的:

function getCookie(c_name) {
    if (document.cookie.length > 0) {
        c_start = document.cookie.indexOf(c_name + "=");
        if (c_start != -1) {
            c_start = c_start + c_name.length + 1;
            c_end = document.cookie.indexOf(";", c_start);
            if (c_end == -1) c_end = document.cookie.length;
            return unescape(document.cookie.substring(c_start, c_end));
        }
    }
    return "";
}

怪异模式:

function readCokie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
    }
    return null;
}

Answer 1

W3CSchool的功能是错误的.如果有多个cookie具有相同的后缀,则会失败,如:

ffoo=bar; foo=baz

当你搜索foo它时,将返回ffoo而不是foo的值.

现在我要做的是:首先,您需要了解cookie的传输方式.Netscape的原始规范(只有像haxx.se这样的副本可用)使用分号分隔多个cookie,而每个名称/值对具有以下语法:

NAME =VALUE
此字符串是一系列字符,不包括分号,逗号和空格.如果需要在名称或值中放置此类数据,%XX则建议使用某种编码方法(如URL样式编码),但不定义或要求编码.

因此,document.cookie以分号或逗号分割字符串是可行的选择.

除此之外,RFC 2109还指定cookie由分号或逗号分隔:

cookie          =       "Cookie:" cookie-version
                        1*((";" | ",") cookie-value)
cookie-value    =       NAME "=" VALUE [";" path] [";" domain]
cookie-version  =       "$Version" "=" value
NAME            =       attr
VALUE           =       value
path            =       "$Path" "=" value
domain          =       "$Domain" "=" value

尽管两者都是允许的,但首选逗号,因为它们是HTTP中列表项的默认分隔符.

注意:为了向后兼容,Cookie标头中的分隔符;到处都是分号().服务器还应接受逗号(,)作为cookie值之间的分隔符,以便将来兼容.

此外,名称/值对还有一些进一步的限制,因为VALUE也可以是RFC 2616中指定的带引号的字符串:

attr        =     token
value       =     token | quoted-string

所以这两个cookie版本需要单独处理:

if (typeof String.prototype.trimLeft !== "function") {
    String.prototype.trimLeft = function() {
        return this.replace(/^\s+/, "");
    };
}
if (typeof String.prototype.trimRight !== "function") {
    String.prototype.trimRight = function() {
        return this.replace(/\s+$/, "");
    };
}
if (typeof Array.prototype.map !== "function") {
    Array.prototype.map = function(callback, thisArg) {
        for (var i=0, n=this.length, a=[]; i<n; i++) {
            if (i in this) a[i] = callback.call(thisArg, this[i]);
        }
        return a;
    };
}
function getCookies() {
    var c = document.cookie, v = 0, cookies = {};
    if (document.cookie.match(/^\s*\$Version=(?:"1"|1);\s*(.*)/)) {
        c = RegExp.$1;
        v = 1;
    }
    if (v === 0) {
        c.split(/[,;]/).map(function(cookie) {
            var parts = cookie.split(/=/, 2),
                name = decodeURIComponent(parts[0].trimLeft()),
                value = parts.length > 1 ? decodeURIComponent(parts[1].trimRight()) : null;
            cookies[name] = value;
        });
    } else {
        c.match(/(?:^|\s+)([!#$%&'*+\-.0-9A-Z^`a-z|~]+)=([!#$%&'*+\-.0-9A-Z^`a-z|~]*|"(?:[\x20-\x7E\x80\xFF]|\\[\x00-\x7F])*")(?=\s*[,;]|$)/g).map(function($0, $1) {
            var name = $0,
                value = $1.charAt(0) === '"'
                          ? $1.substr(1, -1).replace(/\\(.)/g, "$1")
                          : $1;
            cookies[name] = value;
        });
    }
    return cookies;
}
function getCookie(name) {
    return getCookies()[name];
}

Answer 2

是的,W3Schools解决方案不正确.

对于那些想要它的人来说,这是一个更简单的解决方案.它只是预先设置一个空格,因此对indexOf()的单次调用只返回正确的cookie.

function getCookie(c_name) {
    var c_value = " " + document.cookie;
    var c_start = c_value.indexOf(" " + c_name + "=");
    if (c_start == -1) {
        c_value = null;
    }
    else {
        c_start = c_value.indexOf("=", c_start) + 1;
        var c_end = c_value.indexOf(";", c_start);
        if (c_end == -1) {
            c_end = c_value.length;
        }
        c_value = unescape(c_value.substring(c_start,c_end));
    }
    return c_value;
}

Answer 3

来自w3schools,这是不正确的,因为它可能导致错误的cookie:

c_start = document.cookie.indexOf(c_name + "=");

如果你去寻找一个名为cookie foo(我们假设它是一个现有的cookie),那么某个地方document.cookie就是字符串foo=bar.

但是,也不能保证不会有同样是字符串xfoo=something.请注意,这仍然包含子字符串,foo=因此w3schools代码将找到它.如果xfoo首先列出cookie,您将获得something值(错误!)而不是预期值bar.

考虑到两段代码之间的选择,永远不要选择那个从根本上被打破的代码.