我有一个getter从cookie中获取值。

现在我有了两个cookie,名字分别是shares=和obligation =。

我想让这个getter只从义务cookie中获取值。

我怎么做呢?因此for语句将数据拆分为单独的值,并将其放入数组中。

 function getCookie1() {
    // What do I have to add here to look only in the "obligations=" cookie? 
    // Because now it searches all the cookies.

    var elements = document.cookie.split('=');
    var obligations= elements[1].split('%');
    for (var i = 0; i < obligations.length - 1; i++) {
        var tmp = obligations[i].split('$');
        addProduct1(tmp[0], tmp[1], tmp[2], tmp[3]);
    }
 }

在我看来,你可以把cookie键值对分成一个数组,并基于你的搜索:

var obligations = getCookieData("obligations");

运行如下:

function getCookieData( name ) {
    var pairs = document.cookie.split("; "),
        count = pairs.length, parts; 
    while ( count-- ) {
        parts = pairs[count].split("=");
        if ( parts[0] === name )
            return parts[1];
    }
    return false;
}

小提琴:http://jsfiddle.net/qFmPc/

或者甚至可能是以下内容:

function getCookieData( name ) {
    var patrn = new RegExp( "^" + name + "=(.*?);" ),
        patr2 = new RegExp( " " + name + "=(.*?);" );
    if ( match = (document.cookie.match(patrn) || document.cookie.match(patr2)) )
        return match[1];
    return false;
}

一种避免在数组上迭代的方法是:

function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) return parts.pop().split(';').shift();
}

预排

如果字符串中不存在令牌,则通过令牌分割字符串将生成一个包含一个字符串(相同值)的数组;如果字符串中存在令牌,则生成一个包含两个字符串的数组。

第一个(左)元素是标记之前的字符串,第二个(右)元素是标记之后的字符串。

(注意:如果字符串以令牌开头,第一个元素为空字符串)

考虑到cookie的存储方式如下:

"{name}={value}; {name}={value}; ..."

为了检索特定的cookie值,我们只需要获取“;”之后的字符串;{name}=" and before next ";"。在进行任何处理之前,在cookie字符串前加上";,这样每个cookie名称,包括第一个,都包含“;And "=":

"; {name}={value}; {name}={value}; ..."

现在,我们可以先用";{name}=",如果token在一个cookie字符串中找到(即我们有两个元素),我们将以第二个元素为以我们的cookie值开头的字符串结束。然后我们从数组中取出它(即pop),并重复相同的过程,但现在使用“;”作为标记,但这次取出左边的字符串(即shift)以获得实际的标记值。


在我的项目中,我使用以下函数按名称访问cookie

function getCookie(cookie) {
    return document.cookie.split(';').reduce(function(prev, c) {
        var arr = c.split('=');
        return (arr[0].trim() === cookie) ? arr[1] : prev;
    }, undefined);
}

我更喜欢在cookie上使用一个正则表达式匹配:

window.getCookie = function(name) {
  var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
  if (match) return match[2];
}

也可以作为函数使用,检查下面的代码。

function check_cookie_name(name) 
    {
      var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
      if (match) {
        console.log(match[2]);
      }
      else{
           console.log('--something went wrong---');
      }
   }

感谢Scott Jungwirth的评论。


我修改了Jonathan在这里提供的函数,通过使用正则表达式,你可以通过它的名字获得一个cookie值,就像这样:

function getCookie(name){
    var pattern = RegExp(name + "=.[^;]*")
    var matched = document.cookie.match(pattern)
    if(matched){
        var cookie = matched[0].split('=')
        return cookie[1]
    }
    return false
}

如果返回空字符串,则表示cookie存在但没有值,如果返回false则表示cookie不存在。我希望这能有所帮助。


如果你使用jQuery,我建议你使用这个插件:

https://github.com/carhartl/jquery-cookie https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js

<script type="text/javascript"
 src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js">

所以你可以这样读cookie:

var value = $.cookie("obligations");

你也可以写cookie:

$.cookie('obligations', 'new_value');
$.cookie('obligations', 'new_value', { expires: 14, path: '/' });

删除cookie:

$.removeCookie('obligations');

其他一些使用正则表达式的答案中的方法并不涵盖所有情况,特别是:

当饼干是最后一块时。在这种情况下,cookie值后不会有分号。 当另一个cookie名称以正在查找的名称结束时。例如,您正在寻找名为“one”的cookie,而有一个名为“done”的cookie。 cookie名称中包含的字符在正则表达式中使用时不会被解释为字符本身,除非它们前面有反斜杠。

下面的方法可以处理这些情况:

function getCookie(name) {
    function escape(s) { return s.replace(/([.*+?\^$(){}|\[\]\/\\])/g, '\\$1'); }
    var match = document.cookie.match(RegExp('(?:^|;\\s*)' + escape(name) + '=([^;]*)'));
    return match ? match[1] : null;
}

如果没有找到cookie,将返回null。如果cookie值为空,则返回空字符串。

注:

这个函数假设cookie名称是区分大小写的。 文档。cookie——当this出现在赋值的右侧时,它表示一个字符串,其中包含一个以分号分隔的cookie列表,这些cookie又是名称=值对。每个分号后面似乎都有一个空格。 String.prototype.match() -当没有找到匹配时返回null。找到匹配项时返回一个数组,索引[1]处的元素是第一个匹配组的值。

正则表达式

(?:xxxx) -组成不匹配的组。 ^ -匹配字符串的开头。 | -为组分离可选模式。 \\s* -匹配一个分号后面跟着零个或多个空格。 = -匹配一个等号。 (xxxx) -组成匹配组。 [^;]* -匹配零个或多个分号以外的字符。这意味着它将匹配最大(但不包括)分号或字符串末尾的字符。


我知道这是一个老问题,但我也遇到过这个问题。只是为了记录,在开发者的mozilla网页中有一个小API。

你可以只使用JS获得任何名称的cookie。恕我直言,代码也更干净(除了很长的代码行,我相信您可以很容易地修改)。

function getCookie(sKey) {
    if (!sKey) { return null; }
    return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
}

如注释中所述,注意此方法假定键和值是使用encodeURIComponent()编码的。如果cookie的键和值没有被编码,则删除decode & encodeURIComponent()。


总是很有效:

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

function setCookie(variable, value, expires_seconds) {
    var d = new Date();
    d = new Date(d.getTime() + 1000 * expires_seconds);
    document.cookie = variable + '=' + value + '; expires=' + d.toGMTString() + ';';
}

对jQuery或任何东西都没有要求。纯粹的老JavaScript。


下面的函数将返回所需cookie的一个键-值对,其中key是cookie名称,value是cookie的值。

/**
 * Returns cookie key-value pair
 */
var getCookieByName = function(name) {
    var result = ['-1','-1'];
    if(name) {
        var cookieList = document.cookie.split(';');
        result = $.grep(cookieList,function(cookie) { 
            cookie = cookie.split('=')[0];
            return cookie == name;
        });
    }
    return result;
};

cookie示例: JS:

document.cookies = {
   create : function(key, value, time){
     if (time) {
         var date = new Date();
         date.setTime(date.getTime()+(time*24*60*60*1000));
         var expires = "; expires="+date.toGMTString();
     }
     else var expires = "";
     document.cookie = key+"="+value+expires+"; path=/";
   },
   erase : function(key){
     this.create(key,"",-1);
   },
   read : function(key){
     var keyX = key + "=";
     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(keyX) == 0) return   c.substring(keyX.length,c.length);
     }
     return null;
   }
}

使用json或xml存储数组和对象


我会这样做:

function getCookie(cookie){
  return cookie
    .trim()
    .split(';')
    .map(function(line){return line.split(',');})
    .reduce(function(props,line) {
      var name = line[0].slice(0,line[0].search('='));
      var value = line[0].slice(line[0].search('='));
      props[name] = value;
      return props;
    },{})
}

这将以对象的形式返回cookie。

然后你可以这样调用它:

getCookie(document.cookie)['shares']

使用object.defineProperty

有了这个,您可以轻松地访问cookie

Object.defineProperty(window, "Cookies", {
    get: function() {
        return document.cookie.split(';').reduce(function(cookies, cookie) {
            cookies[cookie.split("=")[0]] = unescape(cookie.split("=")[1]);
            return cookies
        }, {});
    }
});

从现在起,你可以这样做:

alert( Cookies.obligations );

这也会自动更新,所以如果你改变了一个cookie, cookie也会改变。


我的解决方案是:

function getCookieValue(cookieName) {
    var ca = document.cookie.split('; ');
    return _.find(ca, function (cookie) {
        return cookie.indexOf(cookieName) === 0;
    });
}

该函数使用Underscorejs _.find-函数。如果cookie名称不存在,则返回undefined


我喜欢使用闭包按名称获取cookie值。下面的闭包将允许您通过名称获取cookie值,但只有在更新了cookie字符串时才会解析cookie字符串。

您可以通过以下方法检索cookie的值:

var foo = cookies.get( "bar" );

代码:

var cookies = ( function() {
    var cookieString = null;
    var cookieArray = [];

    function getValOf( name ) {
        if ( newCookies() ) {
            parseCookieString()
        }
        return cookieArray[ name ];
    }

    // Check if new cookies have been added
    function newCookies() {
        return cookieString === document.cookie;
    }

    function parseCookieString() {
        cookieString = document.cookie;

        // Separate cookies
        var cookies = cookieString.split( ";" );

        // Empty previous cookies
        cookieArray = [];

        // Update cookieArray with new name-value pairs
        for ( var i in cookies ) {

            // Separate name and value
            var nameVal = cookies[ i ].split( "=" );
            var name = nameVal[ 0 ].trim();
            var value = nameVal[ 1 ].trim();

            // Add cookie name value pair to dictionary
            cookieArray[ name ] = value;
        }
    }

    return {

        /**
         * Returns value or undefined
         */
        get: function( name ) {
            return getValOf( name );
        }  
    };
})();

Kirlich给出了一个很好的解决方案。然而,当有两个cookie值具有相似的名称时,它会失败,这里有一个简单的修复这种情况:

function getCookie(name) {
  var value = "; " + document.cookie;
  var parts = value.split("; " + name + "=");
  if (parts.length >= 2) return parts.pop().split(";").shift();
}

这是一个很简短的版本

 function getCookie(n) {
    let a = `; ${document.cookie}`.match(`;\\s*${n}=([^;]+)`);
    return a ? a[1] : '';
}

注意,我使用了ES6的模板字符串来组成正则表达式。


function getCookie(name) {
    var pair = document.cookie.split('; ').find(x => x.startsWith(name+'='));
    if (pair)
       return pair.split('=')[1]
}

由javascript设置

document.cookie = 'cookiename=tesing';

使用jquery-cookie插件来学习jquery

var value = $.cookie("cookiename");

alert(value);

关于如何得到饼干,这里已经有了很好的答案,但这是我自己的解决方案:

function getcookie(cookiename){
var cookiestring  = document.cookie;
var cookiearray = cookiestring.split(';');
for(var i =0 ; i < cookiearray.length ; ++i){ 
    if(cookiearray[i].trim().match('^'+cookiename+'=')){ 
        return cookiearray[i].replace(`${cookiename}=`,'').trim();
    }
} return null;
}

用法:“

     getcookie('session_id');
   // gets cookie with name session_id

查找现有cookie的功能性方法。它返回一个数组,因此它支持同一名称多次出现。它不支持部分键匹配,但是用正则表达式替换过滤器中的=== =是很简单的。

function getCookie(needle) {
    return document.cookie.split(';').map(function(cookiestring) {
        cs = cookiestring.trim().split('=');

        if(cs.length === 2) {
            return {'name' : cs[0], 'value' : cs[1]};
        } else {
            return {'name' : '', 'value' : ''};
        }
    })
    .filter(function(cookieObject) { 
        return (cookieObject.name === needle);
    });
}

获取cookie名称的简单函数:

function getCookie(cn) {
    var name = cn+"=";
    var allCookie = decodeURIComponent(document.cookie).split(';');
    var cval = [];
    for(var i=0; i < allCookie.length; i++) {
        if (allCookie[i].trim().indexOf(name) == 0) {
            cval = allCookie[i].trim().split("=");
        }   
    }
    return (cval.length > 0) ? cval[1] : "";
}

我是这样做的。这样我就有了一个对象来分隔值。有了这个,你可以把cookie传递给父节点,然后你可以通过键来访问你的值

var cookies=getCookieVal(mycookie);
alert(cookies.mykey);
function getCookieVal(parent) {
            var cookievalue = $.cookie(parent).split('&');
            var obj = {};
            $.each(cookievalue, function (i, v) {
                var key = v.substr(0, v.indexOf("="));
                var val = v.substr(v.indexOf("=") + 1, v.length);

                obj[key] = val;

            });
            return obj;
        }  

4年后,ES6更简单的版本。

function getCookie(name) {
  let cookie = {};
  document.cookie.split(';').forEach(function(el) {
    let [k,v] = el.split('=');
    cookie[k.trim()] = v;
  })
  return cookie[name];
}

我还创建了一个主旨,将其用作Cookie对象。例如,Cookie.set(名称,值)和Cookie.get(名称)

这将读取所有cookie而不是扫描。少量的饼干是可以的。


只是为了给这个响应添加一个“正式”的答案,我复制/粘贴解决方案来设置和从MDN检索cookie(这里是JSfiddle

    document.cookie = "test1=Hello";
    document.cookie = "test2=World";

    var cookieValue = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");

    function alertCookieValue() {
      alert(cookieValue);
    }

在您的特定情况下,您将使用以下函数

    function getCookieValue() {
      return document.cookie.replace(/(?:(?:^|.*;\s*)obligations\s*\=\s*([^;]*).*$)|^.*$/, "$1");
    }

注意,我只是用“义务”替换了示例中的“test2”。


显然,MDN从未听说过单词边界正则表达式字符类\b,它与相邻的\w+相匹配,而\w+在两侧有界:

getCookie = function(name) {
    var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
    return r ? r[1] : null;
};

var obligations = getCookie('obligations');

您可以使用js-cookie库来获取和设置JavaScript cookie。

包括到你的HTML:

<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>

创建Cookie。

Cookies.set('name', 'value');

阅读Cookie:

Cookies.get('name'); // => 'value'

参考:https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie

document.cookie = "test1=Hello";
document.cookie = "test2=World";

var cookieValue = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");

  alert(cookieValue);

现在,当以数组格式存储cookie时,可以让cookie以数组形式返回。 例如,你的cookie数组[35]=Khóa;数组[36]= Tử;数组[37]= Cử; 这段代码也包含utf8。 当你的cookie名称内容[]在其中,而你存储的cookie不在数组中时,一件事不会很好地工作。

function getCookie(cname) {

            var ca = decodeURIComponent(document.cookie).split(';');


            if (cname.indexOf('[]') > 0) {
                var returnVAlue = [];
                var nameArray = cname.replace("[]", "");

                for(var i = 0; i < ca.length; i++) {
                    var c = ca[i];
                   // console.log(c);
                    while (c.charAt(0) == ' ') {
                        c = c.substring(1);
                    }

                    if (c.indexOf(nameArray) >= 0) {
                        var valueString = c.substr(nameArray.length, c.length);

                        var valueStringSlit = valueString.split('=');
                        valueStringSlit[0] = valueStringSlit[0].substr(1,(valueStringSlit[0].length - 2));
                    //    console.log(valueStringSlit);

                        returnVAlue.push(valueStringSlit);
                    }
                }
            } else {
                var returnVAlue = '';
                var name = cname + "=";

                for(var i = 0; i < ca.length; i++) {
                    var c = ca[i];
                   // console.log(c);
                    while (c.charAt(0) == ' ') {
                        c = c.substring(1);
                    }
                    if (c.indexOf(name) == 0) {
                        returnVAlue = c.substr(name.length, c.length);
                    } 
                }
            }


            if (returnVAlue != ''){
                return returnVAlue;
            } 
            return "";
        }

       // console.log(decodeURIComponent(document.cookie));


        console.log(getCookie('array[]'));

function GetCookieValue(name) {
    var found = document.cookie.split(';').filter(c => c.trim().split("=")[0] === name);
    return found.length > 0 ? found[0].split("=")[1] : null;
}

The Document property cookie lets you read and write cookies associated with the document. It serves as a getter and setter for the actual values of the cookies.
var c = 'Yash' + '=' + 'Yash-777';
document.cookie = c; // Set the value: "Yash=Yash-777"
document.cookie      // Get the value:"Yash=Yash-777"

来自谷歌GWT项目cookie .java类本机代码。我准备了以下函数来对Cookie执行操作。

函数以JSON对象的形式获取所有cookie列表。

var uriEncoding = false;
function loadCookiesList() {
    var json = new Object();
    if (typeof document === 'undefined') {
        return json;
    }

    var docCookie = document.cookie;
    if (docCookie && docCookie != '') {
      var crumbs = docCookie.split('; ');
      for (var i = crumbs.length - 1; i >= 0; --i) {
        var name, value;
        var eqIdx = crumbs[i].indexOf('=');
        if (eqIdx == -1) {
          name = crumbs[i];
          value = '';
        } else {
          name = crumbs[i].substring(0, eqIdx);
          value = crumbs[i].substring(eqIdx + 1);
        }
        if (uriEncoding) {
          try {
            name = decodeURIComponent(name);
          } catch (e) {
            // ignore error, keep undecoded name
          }
          try {
            value = decodeURIComponent(value);
          } catch (e) {
            // ignore error, keep undecoded value
          }
        }
        json[name] = value;
      }
    }
    return json;
 }

设置并获取具有特定名称的Cookie。

function getCookieValue(name) {
    var json = loadCookiesList();
    return json[name];
}

function setCookie(name, value, expires, domain, path, isSecure) {
    var c = name + '=' + value;
    if ( expires != null) {
        if (typeof expires === 'number') {
            // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now
            var timeInMs = Date.now();
            if (expires > timeInMs ) {
                console.log("Seting Cookie with provided expire time.");
                c += ';expires=' + (new Date(expires)).toGMTString();
            } else if (expires < timeInMs) {
                console.log("Seting Cookie with Old expire time, which is in Expired State.");
                timeInMs = new Date(timeInMs + 1000 * expires);
                c += ';expires=' + (new Date(timeInMs)).toGMTString();
            }
        } else if (expires instanceof window.Date) {
            c += ';expires=' + expires.toGMTString();
        }
    }

    if (domain != null && typeof domain == 'string')
      c += ';domain=' + domain;
    if (path != null && typeof path == 'string')
      c += ';path=' + path;
    if (isSecure != null && typeof path == 'boolean')
      c += ';secure';

    if (uriEncoding) {
        encodeURIComponent(String(name))
            .replace(/%(23|24|26|2B|5E|60|7C)/g, decodeURIComponent)
            .replace(/[\(\)]/g, escape);
        encodeURIComponent(String(value))
            .replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g, decodeURIComponent);

    }
    document.cookie = c;
}

function removeCookie(name) {
    document.cookie = name + "=;expires=Fri, 02-Jan-1970 00:00:00 GMT"; 
}
function removeCookie(name, path) {
    document.cookie = name + "=;path=" + path + ";expires=Fri, 02-Jan-1970 00:00:00 GMT";
}

检查cookie名称是否有效:不能包含'=',';',','或空格。不能以$开头。

function isValidCookieName(name) {
    if (uriEncoding) {
      // check not necessary
      return true;
    } else if (name.includes("=") || name.includes(";") || name.includes(",") || name.startsWith("$") || spacesCheck(name) ) {
      return false;
    } else {
      return true;
    }
}
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test
function spacesCheck(name) {
    var whitespace = new RegExp('.*\\s+.*');
    var result = whitespace.test(name);
    console.log("Name:isContainSpace = ", name, ":", result);
    return result;
}

测试步骤检查以上功能:

setCookie("yash1", "Yash-777");
setCookie("yash2", "Yash-Date.now()", Date.now() + 1000 * 30);
setCookie("yash3", "Yash-Sec-Feature", 30);
setCookie("yash4", "Yash-Date", new Date('November 30, 2020 23:15:30'));

getCookieValue("yash4"); // Yash-Date
getCookieValue("unknownkey"); // undefined

var t1 = "Yash", t2 = "Y    ash", t3 = "Yash\n";
spacesCheck(t1); // False
spacesCheck(t2); // True
spacesCheck(t3); // True

下面是一行代码,可以获得具有特定名称的cookie值,而不需要任何外部库:

const value = ('; '+document.cookie).split(`; COOKIE_NAME=`).pop().split(';')[0];

这个答案是基于kirlich的聪明的解决方案。这个解决方案的唯一妥协是,当cookie不存在时,您将得到一个空字符串。不过,在大多数情况下,这不应该成为交易破坏者。


只需使用以下函数(纯javascript代码)

const getCookie = (name) => {
 const cookies = Object.assign({}, ...document.cookie.split('; ').map(cookie => {
    const name = cookie.split('=')[0];
    const value = cookie.split('=')[1];

    return {[name]: value};
  }));

  return cookies[name];
};

通过名称获取cookie只需将cookie的名称传递给下面的函数

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

我的一个线性函数通过键来获取cookie值。

cookie = key=>((new RegExp((key || '=')+'=(.*?); ','gm')).exec(document.cookie+'; ') ||['',null])[1]

调用cookie函数

cookie('some-key')

我写了一些可能很容易使用的东西,如果有人有什么要补充的,请随时这样做。

function getcookie(name = '') {
    let cookies = document.cookie;
    let cookiestore = {};
    
    cookies = cookies.split(";");
    
    if (cookies[0] == "" && cookies[0][0] == undefined) {
        return undefined;
    }
    
    cookies.forEach(function(cookie) {
        cookie = cookie.split(/=(.+)/);
        if (cookie[0].substr(0, 1) == ' ') {
            cookie[0] = cookie[0].substr(1);
        }
        cookiestore[cookie[0]] = cookie[1];
    });
    
    return (name !== '' ? cookiestore[name] : cookiestore);
}

使用

Getcookie() -返回一个包含网页上所有cookie的对象。

getcookie('myCookie') -从cookie对象返回cookie myCookie的值,否则如果cookie为空或未设置则返回undefined。


例子

// Have some cookies :-)
document.cookie = "myCookies=delicious";
document.cookie = "myComputer=good";
document.cookie = "myBrowser=RAM hungry";

// Read them
console.log( "My cookies are " + getcookie('myCookie') );
// Outputs: My cookies are delicious

console.log( "My computer is " + getcookie('myComputer') );
// Outputs: My computer is good

console.log( "My browser is " + getcookie('myBrowser') );
// Outputs: My browser is RAM hungry

console.log( getcookie() );
// Outputs: {myCookie: "delicious", myComputer: "good", myBrowser: "RAM hungry"}

// (does cookie exist?)
if (getcookie('hidden_cookie')) {
    console.log('Hidden cookie was found!');
} else {
    console.log('Still no cookie :-(');
}

// (do any cookies exist?)
if (getcookie()) {
    console.log("You've got cookies to eat!");
} else {
    console.log('No cookies for today :-(');
}

一行转换cookie为JavaScript对象或地图

Object.fromEntries(document.cookie.split('; ').map(v=>v.split(/=(.*)/s).map(decodeURIComponent)))
new Map(document.cookie.split('; ').map(v=>v.split(/=(.*)/s).map(decodeURIComponent)))

function getCookie(cname) {
  var name = cname + "=";
  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);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}

将cookie名称传递给getCookie()函数以获取它的值


const cookies = 'key1=chocolate; key2=iceCream; key3=cookies;';

// convert string into array with split
const arrCookies = cookies.split('; '); // [ 'key1=chocolate', 'key2=iceCream', 'key3=cookies' ]

// split key value by equal sign
const arrArrCookiesKeyValue = arrCookies.map(cookie => [cookie.split('=')]);  // [[['key1', 'chocolate']], ...']

// make an object with key value
const objectKeyValueCookies = {}; // { key1: 'chocolate', key2: 'iceCream', key3: 'cookies;' }
for (let arr of arrArrCookiesKeyValue) {
    objectKeyValueCookies[arr[0][0]] = arr[0][1];
}

// find the key in object
const findValueByKey = (key = null, objectCookies) => objectCookies[key];
console.log(findValueByKey('key2', objectKeyValueCookies)); // chocolate

这对我来说是完美的(假设cookie名称是唯一的):

function getCookie(name) {
    var cookies = document.cookie;
    var parts = cookies.split(name + "=");
    var cookieValue = '';
    if (parts.length == 2) {
        cookieValue = parts.pop().split(";").shift();
    }
    return cookieValue;
}

一个简单的方法:)

const cookieObj = new URLSearchParams(document.cookie.replaceAll("&", "%26").replaceAll("; ","&"))
cookieObj.get("your-cookie-name")

JS中的Set-Cookie

document.cookie = 'fb-event-id=15648779++';

通过名称函数获取cookie

function getCookie(name) {
    // Split cookie string and get all individual name=value pairs in an array
    var cookieArr = document.cookie.split(";");
    // Loop through the array elements
    for(var i = 0; i < cookieArr.length; i++) {
        var cookiePair = cookieArr[i].split("=");
        /* Removing whitespace at the beginning of the cookie name
        and compare it with the given string */
        if(name == cookiePair[0].trim()) {
            // Decode the cookie value and return
            return decodeURIComponent(cookiePair[1]);
        }
    } 
    // Return null if not found
    return null;
}

这是如何使用getCookie函数

var eventID = getCookie('fb-event-id')

这个方法开箱即用,效果非常好

function getCookie(cname) {
  var cookies = ` ${document.cookie}`.split(";");
  var val = "";
  for (var i = 0; i < cookies.length; i++) {
    var cookie = cookies[i].split("=");
    if (cookie[0] == ` ${cname}`) {
      return cookie[1];
    }
  }
  return "";
}

我写这篇文章是为了在Internet Explorer 11和现代浏览器(如Chromium Edge和Firefox)下工作。

这将获得一个HttpOnly属性为false的cookie值。

    function getCookieValue(keyName) {

        let returnValue = undefined;

        if (keyName && document.cookie) {

            let cookieArray = decodeURIComponent(document.cookie).split('; ');
            for (var i = 0; i < cookieArray.length; i++) {

                if (cookieArray[i]) {
                    let key = cookieArray[i].split('=')[0];
                    if (key && key === keyName) {
                        let value = cookieArray[i].split('=')[1];
                        returnValue = value;
                        break;
                    }
                }

            }

        }

        return returnValue;

    }