Cookies

• Store cookies on a client machine
• Read cookies on a client machine
• Use cookies to save state (persist data)
• Set expiration dates on cookies
• Delete cookies
• Store multiple values in a cookie
• Use a library to work with cookies

Cookies are small packets of information that can be stored on the client computer. They provide a way of storing "state." Cookies are commonly used for shopping carts and user preferences. They are only visible to the site that stored them. They are sent as part of the HTTP protocol to the server where CGI programs can manipulate them. JavaScript can also be used to manipulate cookies.

Cookies are retrieved by JavaScript through the document's cookie property.

Cookies are stored with name/value pairs. The escape() function is often used on the data to be stored because it will translate illegal characters into characters that can be stored. When the escape function is used to store information, the unescape() function should be used to read that information. Unescape translates the characters back to what they originally were.

Storing a cookie is as simple as:document.cookie = "age=" + 19;

A cookie has certain attributes that can be set the same way other data is written to a cookie. These attributes are: domain, path, expires, and secure. The path attribute can be changed if you want your web pages on other directories to be able to read the cookie. The domain can be set if your business has multiple servers in a domain and you wish to make the cookie available to all of them. The secure attribute can be set to provide for encrypted cookie transmission. The expires attribute is used to tell the browser when to delete a cookie.

When cookies are stored as was done in the previous example, separate entries (cookies) are made for each data item stored. There are limitations to cookie storage, though. Web browsers only have to allow 300 cookies total, and only 20 per web server. There is also a 4096 character limit on cookies. If your web site grows large and uses cookies for a number of things, the 20 cookie per server limit could become a problem. For this reason, many web sites will package all their information up into one big cookie.

Often times, a customer will be identified with a unique number stored in a cookie on the client machine, and that number is used to look up the relevant customer information in a database stored on the server. That reduces what has to be stored on the client machine, reduces dependence on the client machine, and makes it easier to reassociate a customer and their information if they login from a different client machine.

The document.cookie property returns a string consisting of ALL the cookies that apply to the document. Even if they are stored internally as separate entries, they are retrieved as one long string. This means that the JavaScript for reading cookies is not simple. Demonstration scripts will be provided for writing, reading, and deleting cookies.

Cookie contents may be modified by writing the cookie with the exact same attributes, but with different values.

A cookie may be deleted by writing the cookie with an expiration date in the past.

• cook01.html: save a cookie
• cook02.html: read a cookie
• cook03.html: make a cookie persist
• cook04.html: change a cookie's value
• cook05.html: save multiple cookie values
• cook06.html: read multiple cookie values
• cook07.html: work with non-standard values
• cook08.html: delete a cookie
• cook09.html: save a cookie using a library
• cook10.html: read a cookie using a library
• cook11.html: delete a cookie using a library
• cook12.html: delete all cookies using a library