Cookies
aka, Persistent Client-Side HTTP Objects

Definition

A mechanism by which both the server and client, through JavaScript, store and retrieve information from the client side of the connection. The information is stored on the client computer for later access.

Uses

User-specific access tracking
Remembering the reader's name
Remembering last visit
Remembering user preferences

Limits

Maximum of 20 cookies can be created for any given domain. Any attempt to set more will cause the oldest cookie to be overwritten. Internet Explorer 3 only allows one cookie per domain.
A given client (browser) can only store a maximum of 300 cookies.
Each cookie cannot exceed 4K (4096 bytes) in size.
Browsers may choose to exceed these limits, but are not required to.

Ingredients

NAME=VALUE: Specifies the name of the cookie entry and the value associated with that named cookie. Sort of like setting a variable: variableName=VALUE. This is the only required component. No ; or , or whitespace is allowed.
Example: visitCount=5
expires=DATE (where DATE is of the form: Wdy, DD-MON-YYYY HH:MM:SS GMT): Defines the lifespan of the cookie. Must be supplied in GMT format. If not specified, the cookie only exists until the browser is shut down.
Example: Mon, 10-Nov-1998 23:14:25 GMT
domain=DOMAIN_NAME: Identifies the valid cookie domain. By default, the domain of the server which generates the cookie response. Must have at least 2 or 3 periods.
path=PATH: Commonly "/". The path name of URL(s) that are allowed access to the cookie. That is, the cookie will be good for all subdirectories below the specified directory. By default, this is the path of the document associated with the cookie.
secure: Indicates whether you need a secure HTTP connection to access the cookie. If set to secure, the cookie will transmit only if the connection between the server and the browser is a secure one. Default: Not secure.

Syntax

document.cookie = "cookieName=cookieData[; expires=timeInGMTstring]
                                        [; path=pathName]
                                        [; domain=domainName]
                                        [; secure]"

The format and order are important. Optional parameters are listed in brackets.

Setting a cookie's expiration date

To calculate an expiration date, one year from today's date:

     var exp = new Date()
     var oneYearFromNow = exp.getTime() + (365 * 24 * 60 * 60 * 1000)
     exp.setTime(oneYearFromNow)

     document.cookie = "cookieName=cookieValue; expires=" + exp.toGMTString()

For one month from today's date replace oneYearFromNow with oneMonthFromNow:

     var oneMonthFromNow = exp.getTime() + (30 * 24 * 60 * 60 * 1000)

For one week from now:

     var oneWeekFromNow = exp.getTime() + (7 * 24 * 60 * 60 * 1000)

Retrieving Cookie Data

Retrieving cookie data with JavaScript is a pain because the entire cookie, including it's name-value pair is all contained in one string. Two or more cookies with the same domain and path will be stored together:

     username=Sam; pwd=devan728; visits=5

To use the data stored in the cookie, you first have to parse it out. That is why I recommend you use Bill Dortch's Cookie Functions listed below.

More notes on Cookies

Multiple cookies associated with a single document will be separated by a ";"
The order in which you set a cookie's data fields is important. Follow the order listed:
NAME=VALUE; expires=DATE; path=PATH_NAME; domain=DOMAIN_NAME; secure
New cookies are written to the hard disk only when the user quits the browser.
Modified cookies are written out immediately.
To modify a cookie, the domain, path, and name portion of the data must match. Otherwise, it will create a new cookie.
To delete a cookie, set its expires parameter to a day in the past. The best date to use is expires=Thu, 01-Jan-70 00:00:01 GMT.
Not all browsers support cookies.
Some servers don't support cookies.

Cookies cannot:

Get data from your hard drive, except the cookie information written by that server.
Retrieve your email address.
Steal credit card numbers, passwords, etc.

Examples:

Get Bill Dortch's Cookie Library (JS file) - right-click and choose Save Link As to download it
Bill Dortch's Cookie Library (HTML) - right-click and choose Save Link As to download it
Bill Dortch's Cookie Library (text file)
Setting Cookies with JavaScript
Retrieving Cookies with JavaScript
Deleting Cookies with JavasScript

References:

Bill Dortch's Cookie Functions: Why reinvent the wheel? These cookie functions were devised by Bill Dortch, an experienced JavaScripter and web site designer. You can use them to handle all of your cookie-related tasks in your web pages. I recommend placing them in an external JavaScript file for easy reuse. If the above link doesn't work, I've placed a copy here.
What Cookies Can Do For You: by Len Vishnevsky. Webmonkey 15 Jan 1998
So You Want a Cookie, Huh?: by Joe Burns, Ph. D.

Related Materials

Cookies aka, Persistent Client-Side HTTP Objects