HTML5 中的 MessageChannel 和 MessagePort 对象是什么？

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

• postMessage() − 通过通道发布消息
• start() − 发送数据
• close() − 关闭端口

在该场景中，我们正在将数据从一个 iframe 发送到另一个 iframe。这里我们在函数中调用 data，并将数据传递到 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);

Krantik Chavan

更新于： 25-06-2020

134 人浏览

开启你的 职业生涯

完成课程后获得证书

开始