How do I open a third party localStorage store on a client website?

Question

I'm writing a third party native JavaScript component which uses localStorage on the client.

When looking at the Resources tab on Chrome DevTools I see that my localStorage entries are stored under the client domain. For example: let's say my file comes from cdn.3rd.com and is used as resource on stackoverflow.com - then in this case my localStorage entries are saved under the http://stackoverflow.com store.

However, looking at different websites, I see that normally third party localStorage entries are saved to stores under the third party's domain. For example in bbc.com I see a store for iperceptions.com, and in cnn.com there's a store for outbrain.com.

So how do I open a localStorage store for my own domain on the client's page?

Answer 1

Due to these following limitations, you can't access localStorage of other 3rd party site.

HTML5 does not allow cross-origin access for localStorage

Basically, localStorage is an origin-specific resource thus access from other sites to the localStorage is prohibited. In the very early stage of HTML5 draft, there was a globalStorage which fully allows cross-domain access but it was then removed due to security concern. So the WebAPI currently focuses on security seriously.

Known workaround - only works if you have an administrative privilege of target site

There is a very nice article which demonstrates how to cross-origin access localStorage with iframe. However, this approach requires you to modify the target site's client script to relay the localStorage content across iframe to your site by message posting. Thus, you can't do it without a full administration access to the target site.