SessionStorage in HTML 5

SessionStorage is an attribute of DOM defined in HTML 5. It is used as a global object in JavaScript or as a sub-object of window, or of an instance of windows.

The object, which represents a storage space is created for a new visitor and deleted when the user disconnects, or at the request of a script.

Compatibility: Implemented in Firefox 3, Internet Explorer 8.

Purpose of sessionStorage

It is an alternative to cookies, but more powerful. The data recorded in the storage are available in all Web pages from the same site and same user during the session. So it is close to the session manager of PHP and it allows for example to register a password to a user to access all services while he stays connected.

In Internet Explorer 8, the space provided to sessionStorage reaches 10 mega bytes when it is 4 KB for each cookie.

Methods of Storage

The methods of the interface Storage in HTML 5 can be used with sessionStorage.

DOMString key(int)    returns the name of a key at the index in argument.
DOMString getItem(DOMString)   returns the value of the key.
void setItem(DOMString, DOMString)  assigns a value to a key. 
void removeItem(DOMString)   removes a key.
void clear()    clear the storage space.

Testing for compatibility

The support of the object may be checked with this JavaScript code:

if(sessionStorage == null) document.write("Storage not supported by the browser");

And in this case:

Using the object

Keys and values are stored by associating them with the sessionStorage object:

sessionStorage.login = "user";
or
sessionStorage["login"] = "user";

You can access the data stored in the same way:

var login = sessionStorage.login;

Demonstration

A text is entered in this page, and we try to display it in another page.

See separate page.

Conclusion

The object can be used in a Web application provided the is asked user to run it under a compatible browser.