localStorage不能跨域,所以在A域名下用localStorage.YourKey方式存储的值,在B域名下是不能取到的。

所以需要转变思路,目前主要使用的两种方式:

一种方式:在A、B两个页面使用document.domain设置为相同的域名,但两个页面需要遵循同源策略,即协议,端口(如果有指定)和域名都相同;在根域范围内,允许把domain属性的值设置为它的上一级域。

另一种方式是推荐方式:在A域下,用postMessage方法把需要保存的数据传递过去,再在B域下接收并保存。postMessage可以安全地实现跨源通信。

postMessage方式实现步骤如下:

一、发送端sendpage.html(在 a.domain.com域名下):

1、sendpage.html中,添加一个iframe,src属性指定接收页面的url:

<iframe id="receivePage" src="http://b.domain.com/receive.html"></iframe>

2、sendpage.html中,在js中添加postMessage方法:

document.getElementById("receivePage").contentWindow.postMessage("要传递的数据","*");

二、接收端receive.html(在b.domain.com域名下):

<!doctype html>
<html>
<head>
</head>
<body style="height:100%;">
<script type="text/javascript">
window.addEventListener('message', function(e) {
if (e.source != window.parent)
return;
if(e.origin != "http://a.domain.com")//请求源验证
return;
localStorage.YourKey = e.data;
}, false);
</script>
</body>
</html>

postMessage参考

H5中用postMessage传递数据,解决localStorage不能跨域问题的更多相关文章

  1. 使用HTML5中postMessage实现Ajax中的POST跨域问题

    HTML5中提供了在网页文档之间相互接收与发送信息的功能.使用这个功能,只要获取到网页所在窗口对象的实例,不仅仅同源(域+端口号)的web网页之间可以互相通信,甚至可以实现跨域通信. 浏览器支持程度: ...

  2. 使用HTML5中postMessage 实现ajax中的POST跨域问题

    HTML5中提供了在网页文档之间相互接收与发送信息的功能.使用这个功能,只要获取到网页所在窗口对象的实例,不仅仅同源(域+端口号)的web网页之间可以互相通信,甚至可以实现跨域通信. 浏览器支持程度: ...

  3. Nginx配置解决NetCore的跨域

    使用Nginx配置解决NetCore的跨域 废话不多说,直接上Nginx配置 server { listen 80; server_name 你的Id或域名; location / { add_hea ...

  4. C#彻底解决Web Browser 跨域读取Iframes内容

    C#彻底解决Web Browser 跨域读取Iframes内容 用C# winform的控件web browser 读取网页内容,分析一下数据,做一些采集工作. 如果是同一个域名下面还是好办的,基本上 ...

  5. 170222、使用Spring Session和Redis解决分布式Session跨域共享问题

    使用Spring Session和Redis解决分布式Session跨域共享问题 原创 2017-02-27 徐刘根 Java后端技术 前言 对于分布式使用Nginx+Tomcat实现负载均衡,最常用 ...

  6. Vue Nginx反向代理配置 解决生产环境跨域

    Vue本地代理举例: module.exports = { publicPath: './', devServer: { proxy: { '/api': { target: 'https://mov ...

  7. 解决ajax请求跨域

    跨域大部分需要通过后台解决,引起跨域的原因: 3个问题同时满足 才可能产生跨域问题,即跨域(协议,主机名,端口号中有一个不同就产生跨域) 下面是解决方法 方法一 // ajax请求跨域 /* *解决a ...

  8. 转:解决tomcat服务器跨域问题

    原文地址: 解决tomcat服务器跨域请求问题 注:还未测试 在tomcat 的web.xml 配置文件中加入如下配置过滤器 (如web.xml中有多个filter时要把下面配置放在最前端) < ...

  9. 使用Spring Session和Redis解决分布式Session跨域共享问题

    http://blog.csdn.net/xlgen157387/article/details/57406162 使用Spring Session和Redis解决分布式Session跨域共享问题

随机推荐

  1. Myeclipse在debug模式下没加断点程序卡住,start模式下可以正常启动

    参考<eclipse在debug模式下卡住,start模式下可以启动>,地址:https://blog.csdn.net/jack_chen1994/article/details/761 ...

  2. 维修数列 Splay(这可能是我写过最麻烦的题之一了。。。用平衡树维护dp。。。丧心病狂啊。。。。)

    题目来源BZOJ1500 这题的思路: 1.这题的话,稍微会splay的人,一般前面四个都不是问题..主要是最后的一个,要你在修改的同时要维护好最大字段和... 2.最大字段和其实就是区间合并.具体操 ...

  3. 【Monkey】Monkey稳定性测试常用命令

    Monkey稳定性测试常用命令: 1.adb shell monkey n 2.adb shell monkey -p  com.android.calculator2 1000 3.adb shel ...

  4. laravel5.5 env

    env 函数 读取的变量里面带有 # 号的情况下 数据会丢失

  5. devexpress—WPF

    https://docs.devexpress.com/WPF/7875/index Ocelot 资源汇总 https://www.cnblogs.com/shanyou/p/10363360.ht ...

  6. c# 关于Threading.ApartmentState

    今天在做一个需求 就是 客户端的注销重新登录的操作,想必大家很清楚这个逻辑应该怎么去做, 在主线程里面去调用这个注销的方法 然后关闭当前应用域,重新开一个线程 让应用域在上面执行. STA(singl ...

  7. 基于服务器AAA的实验

    1.实验拓扑 2.地址分配   Device   Interface   IP Address   Subnet Mask   R0 Fa0/0 192.168.1.2 255.255.255.0 S ...

  8. input输入框失去焦点,软键盘关闭后,滚动的页面无法恢复到原来位置

    H5微信页面开发,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,导致弹框里的按钮响应区域错位. 解决方案:给输入框(或select选择框)添加失去焦点的 ...

  9. webpack 大概

    entry output loader: rules: [ {test:匹配文件格式,  use: 使用的loader}, {test:匹配文件格式,  use: 使用的loader}, ...//l ...

  10. L1-064 估值一亿的AI核心代码

    以上图片来自新浪微博. 本题要求你实现一个稍微更值钱一点的 AI 英文问答程序,规则是: 无论用户说什么,首先把对方说的话在一行中原样打印出来: 消除原文中多余空格:把相邻单词间的多个空格换成 1 个 ...