Javascript Browser Cookies - Setting a Cookie
|
| Share this page: |  |
 |
 |
 |
 |
 |
 |
 |
 |
 |
Set a Cookie - Javascript
The javascript cookie methods on these pages demonstrate how to:- set/put a cookie - Try it
- get/read a cookie - Try it
- delete/remove a cookie - Try it
- restrict webpage access based on a cookie - Try it
Set That Cookie!
This form demonstrates setting a client-side cookie to the visitor's browser using javascript. Of course, in practical applications, the cookie handling will usually happen behind the scenes, transparent to the user. The following sample code will demonstrate setting a cookie of your choosing directly, without requiring input from the user. To store a cookie from your site, simply put a call to the javascript function in your HTML page, like this:
<script type="text/javascript">cookieSet();</script>
The real work is done by the cookieSet() javascript function, which can be either
in the <head> area of your HTML page, or in a separate javascript file:
var cookieText = "Put your desired cookie value here";
var cookiePrefix = "";
var myPage = location.href;
var wwwFlag = myPage.indexOf('www');
if (wwwFlag > 0) {
cookiePrefix = "www";
}
var cookieName = cookiePrefix + "cbCookie";
function cookieSet() {
if (document.cookie != document.cookie) {
index = document.cookie.indexOf(cookieName);
} else {
index = -1;
}
if (index == -1) {
document.cookie=cookieName+"="+cookieText+"cbEndCookie; expires=Monday, 04-Apr-2020 05:00:00 GMT";
}
}
var cookiePrefix = "";
var myPage = location.href;
var wwwFlag = myPage.indexOf('www');
if (wwwFlag > 0) {
cookiePrefix = "www";
}
var cookieName = cookiePrefix + "cbCookie";
function cookieSet() {
if (document.cookie != document.cookie) {
index = document.cookie.indexOf(cookieName);
} else {
index = -1;
}
if (index == -1) {
document.cookie=cookieName+"="+cookieText+"cbEndCookie; expires=Monday, 04-Apr-2020 05:00:00 GMT";
}
}
Notice that our cookie-related variables are declared outside (before) the cookieSet() function. This ensures that the cookieName will be available from elsewhere on our HTML page, which will be helpful when we try to read, or get, the cookie. The wwwFlag checks to see if there is a 'www' in the domain name, and attaches the prefix accordingly. Without this differentiation, trouble can arise when we attempt to read the cookie, since a unique cookie is set depending on whether or not the 'www' is present in the domain name.
About the Cookie
The cookie is a tiny, harmless (dare I say friendly?) little guy - just a plain text file. Mozilla browsers will aggregate cookies from all websites into one file called, appropriately enough, cookies.txt. Within Internet Explorer, each unique website that puts cookies on your machine has a separate cookie file. For Windows XP, the default cookie locations are indicated below:Netscape:
C:\Documents and Settings\[XPuser]\Application Data\Mozilla\Profiles\[your_profile]\cookies.txt
Firefox:
C:\Documents and Settings\[XPuser]\Application Data\Mozilla\Firefox\Profiles\[your_profile]\cookies.txt
IE: (two locations)
1. C:\Documents and Settings\[XPuser]\Cookies
2. C:\Documents and Settings\[XPuser]\Local Settings\Temporary Internet Files\cookie_name.txt
In IE, the cookie names appear differently, depending on the directory that you're viewing. The names also vary depending on whether the cookie is set by a page in the root directory of the website, or in a subdirectory.
1. In the first IE cookie location:
A cookie set by a page in the root directory has a filename in the format:
'[XPuser]@domainname.txt', with the domain name extension omitted.
A cookie set by a page residing in a subdirectory has a filename in the format:
'[XPuser]@[directory_name].txt.
2. In the second IE cookie location:
Cookie set from root has filename 'Cookie:[XPuser]@domainname/'.
Cookie set from subdirectory has filename '[directory_name]'.
Related Pages: