Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript getCookie functions

I found two functions to get cookie data with Javascript, one on w3schools.com and one on quirksmode.org
I would like to know which one I should use?

For example I believe I read somewhere that there was a problem with some browsers splitting the ; semicolon?

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

quirksmode:

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; } 
like image 234
FFish Avatar asked Oct 23 '10 11:10

FFish


People also ask

Can you access cookie using JavaScript?

JavaScript can create, read, and delete cookies with the document.

How do I restore my cookie value?

Just call document. cookie to retrieve the current value of all cookies. You can then store this value in a variable for further manipulation.

How do I get a cookie name?

cookie is "Name=John; LastName=Doe", calling split("Name=") returns an array with three strings and the method doesn't return the right value for getCookie("Name"). Warning about implementation in this answer: if there is more than one cookie by the same name then no cookie value will be returned.


1 Answers

The function from W3CSchool is wrong. It fails if there are multiple cookies that have the same suffix like:

ffoo=bar; foo=baz 

When you search for foo it will return the value of ffoo instead of foo.

Now here is what I would do: First of all, you need get to know the syntax of how cookies are transported. Netscape’s original specification (there are only copies available like this one at haxx.se) uses semicolons to separate multiple cookies while each name/value pair has the following syntax:

NAME=VALUE
This string is a sequence of characters excluding semi-colon, comma and white space. If there is a need to place such data in the name or value, some encoding method such as URL style %XX encoding is recommended, though no encoding is defined or required.

So splitting document.cookie string at semi-colons or commas is a viable option.

Besides that, RFC 2109 does also specify that cookies are separated by either semi-colons or commas:

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 

Although both are allowed, commas are preferred as they are the default separator of list items in HTTP.

Note: For backward compatibility, the separator in the Cookie header is semi-colon (;) everywhere. A server should also accept comma (,) as the separator between cookie-values for future compatibility.

Furthermore, the name/value pair has some further restrictions as the VALUE can also be a quoted string as specified in RFC 2616:

attr        =     token value       =     token | quoted-string 

So these two cookie versions need to be treated separately:

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]; } 
like image 195
Gumbo Avatar answered Sep 20 '22 04:09

Gumbo