当消息为 IE 11 时,window.postMessage 似乎仍然被破坏
- 在窗口和子弹出窗口/选项卡之间使用 window.open
- 当它从不同的域发送时[或在某些情况下相同的域,参见更新 16/01]
IE 8/9/10 也存在类似问题,但此功能在 IE 10 中被标记为“部分支持”,在 IE 11 中被标记为“支持”
有一个代码示例适用于 chrome/ff 但不适用于 IE:
The 开场白(jsfiddle) http://jsfiddle.net/L4YzG/5/:
$(document).ready(function() {
$('#log').append('listening...');
window.addEventListener("message", function(e){
$('#log').append("Received message: " + JSON.stringify(e.data));
}, false);
$('button').click(function() {
window.open('http://jsbin.com/eQeSeros/1', 'popup','menubar=no, status=no, scrollbars=no, menubar=no, width=200, height=100');
});
});
The 子弹出窗口 (jsbin) http://jsbin.com/eQeSeros/1:(如果不是通过jsfiddle打开则不起作用)
$(document).ready(function() {
$('body').append('sending...');
window.opener.postMessage("Hello?", "http://fiddle.jshell.net");
$('body').append('sent...');
});
我从帖子中读到跨源postMessage在IE10中是否被破坏? https://stackoverflow.com/questions/16226924/is-cross-origin-postmessage-broken-in-ie10我们可以使用MessageChannel
代替postMessage
,但是阅读文档,我没有找到如何在实际案例中使用它,因为你必须将端口传递给子窗口。
在我需要发送消息之前有一个重定向链,所以即使我可以发送端口,我也会丢失最初/重定向之前发送的任何 js 对象。
有更换的想法吗?
更新 14/01:我正在考虑在窗口/选项卡标题中传递我的数据,并定期从父级检查此标题......但这将是一个相当肮脏的伎俩。
更新 16/01:真正糟糕的部分是,即使消息是从同一域发送的,但在被另一个域重定向之后,它也会中断。
这是例子:http://jsfiddle.net/L4YzG/13/ http://jsfiddle.net/L4YzG/13/打开弹出窗口http://jsbin.com/eQeSeros/4/edit http://jsbin.com/eQeSeros/4/edit重定向到http://jsfiddle.net/mxS8Q/2/ http://jsfiddle.net/mxS8Q/2/(发布消息)
如果直接通过最终的 url 重定向来更改 url 弹出窗口http://jsfiddle.net/mxS8Q/2/show http://jsfiddle.net/mxS8Q/2/show这适用于 IE,因为开头和结尾之间没有其他域
我仍在研究我的窗口标题肮脏的把戏。当窗口位于另一个域时,我们无法接收该窗口的标题,但如果它返回到 jsfiddle,则标题可用(不存在之前 postMessage 的问题)。这是示例:http://jsfiddle.net/L4YzG/14/ http://jsfiddle.net/L4YzG/14/...这可能是一个替代解决方案,但我刚刚看到一些关于在 cookie 中传递数据的内容,它只需要进行测试。
更新 04/02:传递标题中的信息是不够的,如果最终域相同但不是跨域,则效果很好。我想注入同一域的 iframe 来传递这些信息,但我也无法共享子窗口对象(postMessage 需要一个可序列化的对象)。
最后,我尝试在注入的 iframe 和子窗口之间共享一个 cookie(在 js 中创建和接收),这在 chrome 和 ff 上运行良好,但仍然无法使用 IE 正确接收它。添加 P3P 标头后工作正常,这似乎是真正的解决方案。 Safari 似乎对这种技术有一些问题,所以我只是保留这种技术作为后备。