iframe 跨域之间共享localStorage,sessionStorage

 
  

如:aaa.com 中读取bbb.com的localStorage

9-1 实现原理:

1-1.在aaa.com的页面中,在页面中嵌入一个src为bbb.com的iframe,此时这个iframe里可以调用bbb.com的localStorage。

1-2.用postMessage方法实现页面与iframe之间的通信。

综合1、2便可以实现aaa.com中调用bbb.com的localStorage

9-2优化iframe:

2-1我们可以在bbb.com中写一个专门负责共享localStorage的页面,例如叫做page1.html,这样可以防止无用的资源加载到iframe中。

9-3 示例:

3-1 以在aaa.com中读取bbb.com中的localStorage的item1为例,写同理:

bbb.com中page1.html,监听aaa.com通过postMessage传来的信息,读取localStorage,然后再使用postMessage方法传给aaa.com的接收者。

This page is for sharing localstorage.

3-2 在aaa.com的页面中加入一个src为bbb.com/page1.html隐藏的iframe。

3-3 在aaa.com的页面中加入下面script标签。在页面加载完毕时通过postMessage告诉iframe中监听者,读取item1。监听bbb.com传回的item1的值并输出。

你可能感兴趣的:(iframe,javascript,html)