我们的志愿者还没有将这篇文章翻译为 中文 (简体)。加入我们帮助完成翻译!
您也可以阅读此文章的English (US)版。
The MessageChannel() constructor of the MessageChannel interface returns a new MessageChannel object with two new MessagePort objects.
Syntax
var channel = new MessageChannel();
Returns
A newly created MessageChannel object.
Example
In the following code block, you can see a new channel being created using the MessageChannel.MessageChannel constructor. When the IFrame has loaded, we pass port2 to the IFrame using MessagePort.postMessage along with a message. The handleMessage handler then responds to a message being sent back from the IFrame (using MessagePort.onmessage), putting it into a paragraph. MessageChannel.port1 is listened to, to check when the message arrives.
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;
}
For a full working example, see our channel messaging basic demo on Github (run it live too).
Specifications
| Specification | Status | Comment |
|---|---|---|
| HTML Living Standard The definition of 'MessageChannel()' in that specification. |
Living Standard |
Browser compatibility
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Basic support | 4 | (Yes) | 41 (41) | 10.0 | 10.6 | 5 |
| Available in workers | (Yes) | (Yes) | 41 (41) | (Yes) | (Yes) | (Yes) |
| Feature | Android | Chrome for Android | Edge | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|---|
| Basic support | 4.4 | 4 | (Yes) | 41.0 (41) | (Yes) | 10.0 | 11.5 | 5.1 |
| Available in workers | (Yes) | (Yes) | (Yes) | 41.0 (41) | (Yes) | (Yes) | (Yes) | (Yes) |