的postMessage到iFrame的阴影DOM有event.source集最晚将event.target铬

我有一个影子DOM的iFrame：的postMessage到iFrame的阴影DOM有event.source集最晚将event.target铬

<iframe id="output-frame" src="http://localhost:8080/external/output.html" data-src="http://localhost:8080/external/output.html" style="height: 570px; width: 322px;"> 
    #document 
     <html>...</html> 
</iframe>

我发个帖子消息吧：

postFrameOrigin: function postFrameOrigin() { 
    var match = /^.*:\/\/[^\/]*/.exec(this.$el.find("#output-frame").attr("data-src")); 

    return match ? match[0] : window.location.protocol + "//" + window.location.host; 
}, 

postFrame: function postFrame(data) { 
    // Send the data to the frame using postMessage 
    this.$el.find("#output-frame")[0].contentWindow.postMessage(JSON.stringify(data), this.postFrameOrigin()); 
    // Here `postMessage` is called ... 
},

我接受它的影子DOM：

bind: function bind() { 
    // Handle messages coming in from the parent frame 
    window.addEventListener("message", this.handleMessage.bind(this), false); 
    // ... here `message` is received ... 
}, 

handleMessage: function handleMessage(event) { 
    var data; 

    this.frameSource = event.source; // event.source contains target (falsly?) 
    this.frameOrigin = event.origin; 

(...)

在Firefox和Chrome浏览器，直到版本52，我收到源对象正确在event.source。从版本53开始，它包含目标对象，与event.target或event.srcElement中的相同。（还有最近的歌剧，因为他们使用Blink）。闪烁切换到该版本的影子dom V1。它看起来像有一个连接。

这是一个错误？如果不是，那么我如何才能访问源对象呢？

来源

2016-12-15 Michael

在我的版本的Chrome（V57）和Opera（V41）的他们仍然是不同的：

console.assert(event.source !== event.target)不会引发任何异常。

另外，如果我给不同的名称到主窗口和框架窗口：

var window.name = 'container' 
... 
<iframe name="frame" ...>

...我可以在handleMessage()回调看着他们：

console.log(event.source.name) // = container 
console.log(event.target.name) // = frame

来源

2016-12-17 22:55:07 Supersharp

的postMessage到iFrame的阴影DOM有event.source集最晚将event.target铬

回答

相关问题