HTML5 Local Storage data not reflected across active tabs/windows in IE 11

Question

We have created a functionality where in we provide users to works with forms in an Offline Mode. We are using HTML 5 Local Storage to store all the offline data. All the forms have their own html files (for example:form-1.html,form-2.html.)

We have a parent html page which makes use of an iframe to load the requried html file based on the form selected from the drop down list. After the user have made the modification in offline mode,the user can sync in their changes by logging to the ASP.Net WebSite.

The problem ,we are facing is that the copy of Local Storage that in modified by the user in the offline mode is not in sync when the user their to sync the changes to ASP.Net Website. In short,when we examine the Local Storage in the IE console of the browser when we login to ASP.Net Website,it does not reflect the changes made to the Local Storage during the offline mode.

Both parent html page and the ASP.Net Website page is serverd from the same domain. I came across this piece of article which says that this is an on going issue and it has not been fixed in IE 11.

IE and Local Storage Issues Please see bullet# 3.

Has any one had the same kind of experience.?

Any work around?

Answer 1

I tested many ideas, for me attaching an empty event handler for onstorage property worked!

The WindowEventHandlers.onstorage property contains an event handler that runs when the storage event fires. This occurs when a storage area is changed (e.g. a new item is stored.)

here is my code

    window.onstorage = function(e){};

Microsoft is well aware of the issue, but after about 3 years , there is still no fix and probably it will never be. more info here

Answer 2

This is a known bug: https://connect.microsoft.com/IE/feedback/details/812563/ie-11-local-storage-synchronization-issues

There is a workaround added to the bug report that you can use indexedDB, which is synchronized among frames. But before you can create a DB, the user need to give your web app permission to create a database.