Offline Session Data storage using HTML5

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.

Thanks.

Abhishek Sur

Abhishek Sur is a Microsoft MVP since year 2011. He is an architect in the .NET platform. He has profound theoretical insight and years of hands on experience in different .NET products and languages. He leads the Microsoft User Group in Kolkata named KolkataGeeks, and regularly organizes events and seminars in various places for spreading .NET awareness. He is associated with the Microsoft Insider list on WPF and C#, and is in constant touch with product group teams. He blogs at http://www.abhisheksur.com His Book : Visual Studio 2012 and .NET 4.5 Expert Development Cookbook. Follow Abhishek at Twitter : @abhi2434