CODEWITHSUNDEEP
javascriptcookies
dramasea
dramasea

Reputation: 3490

Anyone can explain to me document.cookie

I found this code in w3schoool JavaScript cookie section, which is to read the cookie:

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

In this line:

if (document.cookie.length > 0)

what document.cookie.length means?

In this line:

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

why I need to add = after the c_name(cookie name)?

In this line:

c_start = c_start + c_name.length+1;

why I need to add c_name.length+1? What the purpose?

And what the meaning of this line:

  if (c_end==-1) c_end = document.cookie.length;

Can Anyone answer my question? Thanks!!!

Upvotes: 3

Views: 15610

Answers (4)

Darin Dimitrov
Darin Dimitrov

Reputation: 1039438

document.cookie returns a string containing the cookies. Everything else you ask about is pretty standard javascript string manipulation.

if (document.cookie.length > 0)

checks if the string is not empty.

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

finds the index of the first occurrence of the COOKIENAME= substring in the string.

c_start = c_start + c_name.length + 1;

positions the index after the cookie name in the string

c_end = document.cookie.indexOf(";", c_start);
if (c_end == -1) c_end = document.cookie.length;

tries to find the first occurrence of the ; character starting from the c_start position and if this character is not found it positions to the end of the string.

Upvotes: 4

Gumbo
Gumbo

Reputation: 655765

document.cookie is a string and the length property holds the length of the string in characters.

The = is appended to the cookie name because the cookie name could also appear somewhere else in the document.cookie string (like in the cookie value of another cookie). The c_name.length+1 is used because the +1 reflects the = after the cookie name. And indexOf return -1 if the needle could not be found in the haystack; that’s why c_end is compared to -1.

But you shouldn’t use this implementation. Take a look at my answer to Javascript getCookie functions to see why it’s wrong and how a better implementation could look like.

Upvotes: 0

lonesomeday
lonesomeday

Reputation: 238065

OK, quick answers. Firstly, document.cookie is a string containing key=value pairs for each cookie set on this domain.

(1) if (document.cookie.length>0) checks that there are some cookies set, i.e. that the string is not empty.

(2) c_start=document.cookie.indexOf(c_name + "="); the = is needed to make sure that c_name does not occur inside the value of a cookie, only in the key.

(3) c_start=c_start + c_name.length+1; c_start is the place where the key has been found in the string. You then need to add the length of the key plus one (for the =) to find the start of the value.

(4) if (c_end==-1) c_end=document.cookie.length; If the cookie is the last one, there will be no terminating ;, so we look for the very end of the string instead.

Upvotes: 0

davin
davin

Reputation: 45555

see: https://developer.mozilla.org/en/DOM/document.cookie

document.cookie is a string, with key=value pairs separated by semicolons (;).

the code you pasted looks for a specific key in the string, and then finding its value by looking for the end of the string, or the next semicolon, and returning the value it found

so for example, if document.cookie === "someKey=aCookieMadeMeHaveValue7;anotherKey=aShorterValue", you can search for the value of someKey by executing the function getCookie('someKey'), which will look at the string, and return 'aCookieMadeMeHaveValue7'.

it will add +1 to that position so as to jump over the '=', and then return the string from there until the first time it sees a ';' or comes to the end of the string.

Upvotes: 3

Related Questions