HTML5中浏览上下文之间的双向通信

浏览上下文之间的双向通信称为通道消息传递。对于跨多个来源的通信很有用。

创建messageChannel时,它在内部创建两个端口来发送数据并转发到另一个浏览上下文。

  • postMessage() -发布消息抛出通道

  • start() -发送数据

  • close() -关闭端口

在这种情况下,我们将数据从一个iframe发送到另一iframe。在这里,我们调用函数中的数据并将数据传递给DOM。

var loadHandler = function(){
   var mc, portMessageHandler;
   mc = new MessageChannel();
   window.parent.postMessage('documentAHasLoaded','http://foo.example',[mc.port2]);
   portMessageHandler = function(portMsgEvent){
      alert( portMsgEvent.data );
   }
   mc.port1.addEventListener('message', portMessageHandler, false);
   mc.port1.start();
}
window.addEventListener('DOMContentLoaded', loadHandler, false);