Cookie Utility Class
XML Menu Suite
Build powerful, client-side DHTML menus using XML for data and CSS for style. No JavaScript data! No having to place list elements on every single page of your website! No plug-ins!

Class Name: CJL_CookieUtil

Summary:

Cross-platform JavaScript utility class for creating, reading, and deleting cookies. Cookies can be either session or persistent. Has ability to apply unlimited sub-values to a cookie. This allows you to work within the confines of the 20 cookie per server limit.

Submitted: 09/01/2003

Created by: CodeHouse.com

Browser Compatibility:

  • Internet Explorer for Windows 5.0+
  • Internet Explorer for Macintosh 5.0+
  • Netscape 6.1+
  • Mozilla 1.0+
  • Opera 7.0+
  • Safari 1.0+

Demo:

You can run the demo online by clicking the button below. The demo is also available in the script download.

Class Index:

Constructor: CJL_Cookie

CJL_CookieUtil(name, duration, path, domain, secure)

Description:

Creates a utility object for performing client-side browser cookie operations.

The path and domain parameters map directly to the Set-Cookie HTTP Response Header, as described by Netscape in the Persistent Client State HTTP Cookies Specification (PCSHCS).

Note that no cookie is actually created unless a value is written to the cookie using the setSubValue() method.

Example Usage:

In the code below, an instance of the cookie utility class is created and assigned to a variable called session. The session object performs operations on a cookie named "session_cookie". The cookie is a session cookie as opposed to a persistent cookie because the expire parameter is not specified. A session cookie is a cookie that is only valid for the current browser session. When all browser windows are closed, the cookie is automatically deleted.

var session = new CJL_CookieUtil("session_cookie");

In the code below, the session object writes two sub-values to its cookie. The first is val1, which it assigns "This is sub-value one". The second is val2, which it assigns "This is sub-value two".

session.setSubValue("val1", "This is sub-value one");
session.setSubValue("val2", "This is sub-value two");

In the code below, the sub-values of session's cookie are printed out with an alert box.

alert("val1=" + session.getSubValue("val1") +
      "\n\n" +
      "val2=" + session.getSubValue("val2"));

Click here to see the actual alert box generated from the code above.

The code below creates a utility object called persistent for a cookie named "my_5_minute_Cookie". The cookie is set to persist for 5 minutes. Because the path parameter wasn't specified, the cookie is only accessible to web pages in the current directory and any subdirectories.

var persistent =
   new CJL_CookieUtil("my_5_minute_Cookie", 5);

If we wanted to make the cookie globally accessible to any web page on the server, we would have used the following constructor instead:

var persistent =
   new CJL_CookieUtil("my_5_minute_Cookie", 5, "/");

If we wanted to remove the cookie, we would use the following code:

persistent.expire();

Parameters:

name:
Required parameter. String value that does not include any of the following characters: semi-colon, comma, white space, and the "@" character. Non-string values will be converted to a string.

duration:
Integer value that defines how many minutes the cookie should persist for. If this parameter isn't specified, a session cookie is created.

path:
String value specifying the path that the cookie is in scope for. If this parameter isn't specified, the cookie is only available for the directory that it was created in, and any of its subdirectories. The most common value for this parameter is "/", which specifies the root of the website. Giving the cookie root scope makes it available globally throughout your website. This parameter maps directory to the path parameter described in the PCSHCS.

domain:
String value. This parameter maps directly to the domain parameter described in the PCSHCS. This parameter is only necessary for sites that run multiple sub domains.

secure:
Boolean value. If this parameter is true, the cookie created will only be transmitted under Secure Sockets Layer (SSL).

Methods:

Returns true if the cookie this utility class is associated with exists. Otherwise returns false. The actual cookie would have the same name as that specified in the name parameter to the constructor.

expire()
Sets back the expiration date of the cookie so that it will not persist after the session is over. Subsequent cookie operations should not be performed after this call, for the rest of the session, or the expiration date of the cookie will revert back to its original value.

setSubValue(key, value)
Sets or removes a key/value pair, depending upon the value of the value parameter.

Parameters:

key: A string used to identify the value parameter in calls to getSubValue().

value: The string value corresponding to the key. If value is null, the key/value pair is deleted. Otherwise, value is associated with key.

getSubValue(key)
Returns the value associated with key.

Parameters:

key: A string used to identify the sub-value

Comments:

Because a user may have limited or turned off cookie support, you should not assume that you will be able to perform cookie operations. This class should however work without side-effects in the event that cookie support has been turned off.

The navigator.cookieEnabled property can be used to determine if cookies are supported by the user's browser.

Download Cookie Utility Script and Demo:

Download cookie.zip

Configuration Instructions:

Step 1:

Before using the source code, make sure that you read and agree to the terms of the License Agreement, which will open in a separate window.

Step 2:

Download cookie.zip to your local computer. cookie.zip contains the following files:

cjl_cookie.js
cookie_demo.htm

The cookie utility class is contained within cjl_cookie.js.

cookie_demo.htm is the demo file. It is for instructional purposes only. This file isn't necessary unless you're running the demo.

Note that if you are using Safari or Internet Explorer for the Mac to open cookie_demo.htm, you should first upload the demo to your server, because neither of these browsers seem to support the local creation of cookies.

Step 3:

Open an HTML file, or create a new one. We'll call this HTML file the Target Page. Place the following line between the opening and closing <head></head> tags of the Target Page:

<script src="cjl_cookie.js" type="text/javascript"></script>

Step 4:

Upload the Target Page and cjl_cookie.js to your web server, and place them in the same directory.

That's it! You are now armed with cookie technology so powerful, that your rivals will beg for mercy.

If you have any questions, find any bugs, or have suggestions, feel free to contact us.