Multiple Tab LocalStorage single user Use case

Question

I currently have a SaaS B2B product, I'd love to show for the sake of example, if it weren't behind a VPN. But the case is, Its built on top of Zend Framework it is using Zend's session handling. That said my users recently decided that with recent improvements to various ends of the UI that they want to use the Service across multiple tabs at once, which isn't exactly currently supported, but in the name of wanting to keep on improving. I have to meet demands. That said. With this one piece of the service I have been managing data with cookies, since the page can be reloaded, and the UI re-rendered respectively to match the reloaded UI (the reload is triggered by content in an iFrame, since we can't communicate parent child from within the frame.

However now that my users are insisting on doing the same action across multiple tabs trying to save time, this breaks the UI since the cookies are not in any way shape or form tagged with an ID, from which I wouldn't even know how to imply that since I can't necessarily track tabs. So With all this I figured i'd give localstorage a go. However I am still not sure how to handle a single user on multiple tabs to prevent UI data being used on different tabs, more so if the page gets refreshed at a given time which could maybe lose data in localstorage?

So what I am trying to figure out all in all. Is how to manage this single user across one or more tabs without one tabs data interfering with the other tabs data, since the actions and ui are all contained within the same domain. (Does this clarify anything better?)

Solution

Yes, you can use localStorage to store data for your web app. Also, have a look at sessionStorage which is window/tab specific and stores data per session.

Read more here:

HTML5 Web Storage

Scope of sessionStorage and localStorage