MessageChannel

Channel Messaging API的MessageChannel接口允许我们创建一个新的消息通道，并通过它的两个MessagePort属性发送数据

Properties

MessageChannel.port1 只读

返回channel的port1.

MessageChannel.port2 只读

返回channel的port2.

Constructor

MessageChannel()

返回一个带有两个MessagePort属性的MessageChannel新对象

Example

在以下代码块中，您可以看到使用MessageChannel（）构造函数创建的新通道。当<iframe>加载完毕，我们使用MessagePort.postMessage方法把一条消息和MessageChannel.port2传递给<iframe>。handleMessage处理程序将会从<iframe>中（使用MessagePort.onmessage监听事件）接收到信息，将数据其放入一个段落。

var channel = new MessageChannel();
var para = document.querySelector('p');
var ifr = document.querySelector('iframe');
var otherWindow = ifr.contentWindow;
ifr.addEventListener("load", iframeLoaded, false);
function iframeLoaded() {
  otherWindow.postMessage('Hello from the main page!', '*', [channel.port2]);
}
channel.port1.onmessage = handleMessage;
function handleMessage(e) {
  para.innerHTML = e.data;
}   

一个完整的运行示例，可以在Github上查看 channel messaging basic demo  (run it live too).

Specifications

Browser compatibility

See also

• Using channel messaging