Get cookie by name

Get cookie by name

I have a getter to get the value from a cookie.
Now I have 2 cookies by the name shares= and by the name obligations= .
I want to make this getter only to get the values from the obligations cookie.
How do I do this? So the for splits the data into separate values and puts it in an array.
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]); } }

Solutions/Answers:

Solution 1:

One approach, which avoids iterating over an array, would be:

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

Walkthrough

Splitting a string by token will produce either, an array with one string (same value), in case token does not exist in a string, or an array with two strings , in case token is found in a string .

The first (left) element is string of what was before the token, and the second one (right) is what is string of what was after the token.

(NOTE: in case string starts with a token, first element is an empty string)

Considering that cookies are stored as follows:

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

in order to retrieve specific cookie value, we just need to get string that is after “; {name}=” and before next “;”. Before we do any processing, we prepend the cookies string with “; “, so that every cookie name, including the first one, is enclosed with “; ” and “=”:

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

Now, we can first split by “; {name}=”, and if token is found in a cookie string (i.e. we have two elements), we will end up with second element being a string that begins with our cookie value. Then we pull that out from an array (i.e. pop), and repeat the same process, but now with “;” as a token, but this time pulling out the left string (i.e. shift) to get the actual token value.

Solution 2:

I would prefer using a single regular expression match on the cookie:

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

OR Also we are able to use as a function , check below code.

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---');
      }
   }

Improved thanks to Scott Jungwirth in the comments.

Solution 3:

use a cookie getting script:

function readCookie(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;
}

then call it:

var value = readCookie('obligations');

i stole the code above from quirksmode cookies page. you should read it.

Solution 4:

If you use jQuery I recommend you to use this plugin:

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">

So you can read cookie like this:

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

Also you can write cookie:

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

Delete cookie:

$.removeCookie('obligations');

Solution 5:

The methods in some of the other answers that use a regular expression do not cover all cases, particularly:

  1. When the cookie is the last cookie. In this case there will not be a semicolon after the cookie value.
  2. When another cookie name ends with the name being looked up. For example, you are looking for the cookie named “one”, and there is a cookie named “done”.
  3. When the cookie name includes characters that are not interpreted as themselves when used in a regular expression unless they are preceded by a backslash.

The following method handles these cases:

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;
}

This will return null if the cookie is not found. It will return an empty string if the value of the cookie is empty.

Notes:

  1. This function assumes cookie names are case sensitive.
  2. document.cookie – When this appears on the right-hand side of an assignment, it represents a string containing a semicolon-separated list of cookies, which in turn are name=value pairs. There appears to be a single space after each semicolon.
  3. String.prototype.match() – Returns null when no match is found. Returns an array when a match is found, and the element at index [1] is the value of the first matching group.

Regular Expression Notes:

  1. (?:xxxx) – forms a non-matching group.
  2. ^ – matches the start of the string.
  3. | – separates alternative patterns for the group.
  4. ;\\s* – matches one semi-colon followed by zero or more whitespace characters.
  5. = – matches one equal sign.
  6. (xxxx) – forms a matching group.
  7. [^;]* – matches zero or more characters other than a semi-colon. This means it will match characters up to, but not including, a semi-colon or to the end of the string.

Solution 6:

4 years later, ES6 way simpler version.

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

I have also created a gist to use it as a Cookie object. e.g., Cookie.set(name,value) and Cookie.get(name)

This read all cookies instead of scanning through. It’s ok for small number of cookies.