Browser Local storage and SSL

Question

This is in reference to my work site: []

This link will be removed when my question is answered :(

We are using the browsers local storage to store the users cart. So when adding an item to the cart notice the mini cart will keep in sync as you would expect.

Here are the steps to reproduce the bug.

1. Add item to cart under non SSL page
2. Navigate to cart. (which is under SSL)
3. Increase quantity by 1 on the cart page
4. Navigate back to an insecure page
5. Notice the minicart is not correct

This is happening because there are essentially two versions of local storage, 1 under SSL and 1 under an insecure page. How do I invalidate the insecure localstorage from the secure page?

Requirement: We need the cart page to be under SSL

Thanks.

Answer 1

Per the HTML5 spec, localStorage can not be transferred from HTTP to HTTPS.

The easiest way would be to store all localStorage off of one domain. Ex: https://www.example.com

See: Is there any workaround to make use of html5 localstorage on both http and https? for a similar question.