Reading a Cookie (basic JavaScript)

JavaScript FAQ | JavaScript Cookies FAQ  

Question: How do I read a cookie with a given name?

Answer: Here is a function for reading a cookie

cookieName
that has been set by
SetCookie
. It relies on the standard string manipulation methods:
substring()
and
indexOf()
. The function runs without errors even in very old browsers with the earliest implementations of JavaScript:
function ReadCookie(cookieName) {
 var theCookie=" "+document.cookie;
 var ind=theCookie.indexOf(" "+cookieName+"=");
 if (ind==-1) ind=theCookie.indexOf(";"+cookieName+"=");
 if (ind==-1 || cookieName=="") return "";
 var ind1=theCookie.indexOf(";",ind+1);
 if (ind1==-1) ind1=theCookie.length; 
 return unescape(theCookie.substring(ind+cookieName.length+2,ind1));
}
Cookie Name: 
 

A note on reliability: Why did we need to prefix the cookie with a space (

" "+
) or a semicolon (
";"+
) in the beginning of the function? Here is why: to avoid false matches. Assume that we succefully created one cookie named
MyCookie
. Now try reading some other cookies; specifically, try cookie names
e
or
ie
or
okie
... These other cookies presumably do not exist; however, a buggy version of
ReadCookie
without the highlighted safeguards would still return a non-empty value (most likely, the same value as for
MyCookie
)
-
as if all of the above cookies were present! We thus see that there are important special cases where a quick-and-dirty reader function may easily fail.

Difficult special cases like this manifest themselves especially when there are two or more semicolon-separated cookies in the

document.cookie
string
-
and that's exactly what may happen on big websites in real life. What if we must read not only cookies set by our own scripts, but also those cookies that came from various server-side applications? Let us consider
document.cookie
examples that we might want to handle with our cookie-reader function.

Examples of

document.cookie:

name1=value1; name2=value2; name3=value3; name4=value4; . . .  //an easy case  

Just_a_value; name2=name1=a&b=c; name1=value1; e1=v1; e2=v2;   //more difficult
Here are the pitfalls:
(1) The
cookieName
argument may hold a substring of some other existing cookie name(s)
(2)
cookieName
may hold a substring of another cookie's value
(3) Cookies may have a complex multilevel structure, e.g.
name2=a=b&b=1&&c=d;...

(4) Cookies in
document.cookie
may or may not have the
name=value
format
(5) There might be a (rare) requirement to support commas as well as semicolons in the role of cookie separators.

Next, we'll write another function for reading a cookie using regular expressions. As you will see, the

RegExp
-based version turns out to be shorter and easier to modify, but somewhat less readable. Please read on...

Copyright © 1996-2018, JavascriptFAQ.net.