How to put Objects on HTML5 sessionStorage/localStorage

HTML5 sessionStorage and localStorage only allows you to store strings, but sometimes it’s very convenient to add more complex values like arrays and objects. Here a simple way to do that:

var array = [];
// Put object on sessionStorage
sessionStorage.setItem('key', JSON.stringfy(array));
// Get object from sessionStorage
var object = JSON.parse(sessionStorage.getItem('key'));

As you can see in the example I’ve just converted my array to a string before storing it in the sessionStorage, then I converted it back to an array when I retrieved it from the sessionStorage. This was a very simple workaraound, hope it helps!

Recommended for you

How to Load a JSON file in Javascript In this post I'm going to give you a very simple example of how to read a JSON file and display the data on the page. I'll be using jQuery in this example, so if you don't have it on your project don't forget to add the script. So let's get started, first we need a JSON, you probably already have...
Node.js: How to make POST Requests with JSON data In this post I'm going to show you how to work with POST requests, I'll give you an example as simple as possible. First I'll create the Nodejs app to receive the requests, then I'll show you how to make the requests from the frontend. We're going to be using Expressjs, it's a very popular npm pa...
Tutorial: Implementing Infinite Scroll with AngularJS and ngInfiniteScroll Over the past few years the infinite scroll has became very popular across the web, developers are increasingly choosing to use infinite scroll over the conventional paginator. The advantage is that it doesn't require the user to manually go to the next page when he reaches the end of the page, it a...
How to use ES6 (Very Simple Example) Compiling Javascript ES6 Code with Babel This will be a very simple tutorial on how to use, the new and far more sophisticated version of Javascript, the ES6 (or ES2015 if you prefer). Much people say ES6 is the future of Javascript, but as everybody knows, our browsers cannot run code in this f...

Leave a Reply

Your email address will not be published. Required fields are marked *

Obs: Use the tag <pre lang="LANGUAGE"> to include code blocks to your comment.
Example: <pre lang="javascript"> console.log('Test'); </pre>