...

View Full Version : Cookies



Jimbolgs
03-04-2012, 07:40 PM
Hello,

I know there are dozens of threads on this topic but I can't figure out how to do what I want to do.

I have three variables I want to store in a cookie when a user leaves this page which is a college project: http://jimbolgs.agilityhoster.com/worldclock/ClockUTC.html

They are (from the linked JS file): extraMins, geoLoc, UTCHours.

I would also like to retrieve them on return to the page.

Any help appreciated, Thanks.

TooCrooked
03-04-2012, 08:36 PM
here's a well designed tutorial: http://www.elated.com/articles/javascript-and-cookies/

the tutorial explains the syntax and each argument in detail. you can't fail if you follow it.

to set a basic cookie, you just use code formatted thusly:


document.cookie = "name=value; expires=date;

by changing the "name", you can set multiple cookies. so for instance, if i typed:



document.cookie = "cookie1=some data; expires=Thu, 2 Aug 2012 20:47:11 UTC"
document.cookie = "cookie2=more data; expires=Thu, 2 Aug 2012 20:47:11 UTC"


i would get two cookies that i could call. there's more properties and parameters you can set for cookies, but the tutorial covers all that.

so if you want to retrieve a cookie, you just set some variable to "document.cookie":


var x = document.cookie

variable "x" will then get a STRING value which gives you a name/value pair, something like:


bblastvisit=1325358324; bblastactivity=0; cookie1=some data; popunder=yes; popundr=yes; setover18=1

the tutorial i linked has an excellent snippet for parsing out a specific value from a given cookie name, using the following function:


function get_cookie ( cookie_name )
{
var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' );

if ( results )
return ( unescape ( results[2] ) );
else
return null;
}

after that, you can do whatever you want with the value.

i would suggest using firefox to learn how to manipulate cookies. if you press "Control + Shift + K", it brings up the "web console" where you can enter javascript directly into the field and test to your hearts content.

once you can set and verify cookies, then start screwing around with retrieving them. it's simple. the second the page loads, it looks for a cookie, and if found, stores the contents into the "document.cookie" property. all you do is request the information and then act on whatever is in the request.

Jimbolgs
03-04-2012, 10:09 PM
Thanks for that. I'll have a good go at it tomorrow.

Logic Ali
03-05-2012, 03:19 AM
Thanks for that. I'll have a good go at it tomorrow.
I would suggest that you challenge yourself further by storing all your data in just one cookie, using a format that facilitates separating it upon retrieval.

felgall
03-05-2012, 07:03 AM
the tutorial i linked has an excellent snippet for parsing out a specific value from a given cookie name, using the following function:


function get_cookie ( cookie_name )
{
var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' );

if ( results )
return ( unescape ( results[2] ) );
else
return null;
}

after that, you can do whatever you want with the value.



Not quite excellent since it uses the long deprecated unescape() call instead of the decodeURIComponent() call that relplaced it many years ago.

The difference between the two is that unescape only supports the first 127 characters in the ASCII characterset whereas decodeURIComponent can handle the first 65535 unicode characters.

If they made that one update to bring it into the 21st Century then it would be excellent.

Jimbolgs
03-05-2012, 07:39 PM
Okay, I think I'm nearly there. My cookies are set and I can retrieve the string, but I'm struggling to parse it.

Does anyone know what I'm doing wrong?

This is the function I’m using to set the cookies:


function setCookies() {
var cookieStringHours = ("hours=" + zoneHours + ";" + "expires=15/08/2012 00:00:00; path=/");
document.cookie = cookieStringHours;
var cookieStringMins = ("mins=" + zoneMins + ";" + "expires=15/08/2012 00:00:00; path=/");
document.cookie = cookieStringMins;
var cookieStringLocation = ("location=" + geoLoc + ";" + "expires=15/08/2012 00:00:00; path=/");
document.cookie = cookieStringLocation;
var cookieStringTab = ("tab=" + currentTab + ";" + "expires=15/08/2012 00:00:00; path=/");
document.cookie = cookieStringTab;
}



This is the code I’m using to check the cookie has worked:
It returns a string like this: hours=-8; mins=0; location=Vancouver; tab=clock


function getCookies() {
var docCookie = document.cookie;
alert (docCookie);
}



Finally, this is the code I’m trying to use to parse the location from the string:
It returns a string like this: ; location=Vancouver;,;,Vancouver,;


function get_cookie(location)
{
var results = document.cookie.match ( '(^|;) ?' + "location" + '=([^;]*)(;|$)' );
document.write (results);
if ( results )
return ( unescape ( results[2] ) );
else
return null;
}


Click here for a live version. (http://jimbolgs.agilityhoster.com/worldclock/ClockUTC.html)

TooCrooked
03-06-2012, 12:05 AM
first, this is unnecessary:


function getCookies() {
var docCookie = document.cookie;
alert (docCookie);
}

just do:


function getCookies() {
alert(document.cookie)
}

this isn't just to say "you did it wrong", it's to show you how to avoid writing in useless statements. if you're going to create variable for the cookie information, it should be because you need to use the variable in multiple places. you throw that variable away after that function finishes, and you only use it once. also, if you only call getCookies once, get rid of the function declaration and just use "alert("document.cookie")" for your debugging.

that aside,


function get_cookie(location)
{
var results = document.cookie.match ( '(^|;) ?' + "location" + '=([^;]*)(;|$)' );

alert (results);

if ( results )
return ( unescape ( results[2] ) );
else
return null;

}

you put quotes here. that makes the word location an immutable string. you need to remove the quotes and let it be a variable once again.

TooCrooked
03-06-2012, 12:18 AM
NEVER ever, in any script, use "document.write". never. not to say there are no applications for that, but just don't do it. alert it for testing, or use another method for inserting information into the DOM (webpage). get rid of it. replace it with "alert"

so, the reason it looks like that is because you're looking at a textual representation of an array. every comma represents an index in the array:


location=Vancouver;,;,Vancouver,;

"location=Vancouver;" is index 0 (comma)
";" is index 1 (comma)
Vancouver is index 2 (comma)
";" is in index 3

the reason you're seeing this is because you're alerting the entire array, and not an index of the array, the way the tutorial code does ("results[2]")

Logic Ali
03-06-2012, 04:07 AM
Finally, this is the code Iím trying to use to parse the location from the string:
It returns a string like this: ; location=Vancouver;,;,Vancouver,;


function get_cookie(location)
{
var results = document.cookie.match ( '(^|;) ?' + "location" + '=([^;]*)(;|$)' );
document.write (results);
if ( results )
return ( unescape ( results[2] ) );
else
return null;
}




function get_cookie( cName )
{
var v;

return decodeURIComponent( ( v = ( document.cookie || "" ).match( "(^|\\s)" + cName + "=([^;]+)" ) ) ? v[ 2 ] : "" );
}

Jimbolgs
03-06-2012, 09:42 AM
Sorry guys, I can't get this to work.

My tutor's very good, not to suggest that you guys aren't, but perhaps with the code in front of him he can fix this.

His lesson is this afternoon.

Thanks for your help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum