Offline Session Data storage using HTML5

By | June 7, 2012

Well, it might look quite similar with the one I explained before, HTML 5 also includes a separate object to deal with Session storage. The Session storage is actually quite different from localStorage API. In case of sessionStorage, the data will remain only when you are inside current session. Such that when you close the session of the application, the browser automatically flushes the storage allocated on sessionStorage.

The sessionStorage will be cleared out when browser is closed.

Let us look into some code:

window.sessionStorage.setItem('value', 'This is Abhisheks new HTML document');
window.sessionStorage.setItem('timestamp', (new Date()).getTime());

Now as per our previous code, if we replace the code with sessionStorage, the data will be cleared out when browser is closed. We can still use the API methods like :

getItem(key) – retrieves the value for the given key or null if the key doesn’t exist.
setItem(key, value) – sets the value for the given key.
removeItem(key) – removes the key completely.
key(position) – returns the key for the value in the given numeric position.
clear() – removes all key-value pairs

Hence the object looks quite similar to one that we have explained before, but the only difference is that the sessionStorage deletes all cached entries when browser is closed.


I hope this is helpful.