The port1
read-only property of the MessageChannel
interface returns the first port of the message channel, the port attached to the context that originated the channel.
Syntax
channel.port1;
Value
A MessagePort
object, the first port of the channel, that is the port attached to the context that originated the channel.
Example
In the following code block, you can see a new channel being created using the MessageChannel()
constructor. When the <iframe>
has loaded, we pass MessageChannel.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. The handleMessage
method is associated to the port1
to listen 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 |
---|---|---|
WHATWG HTML Living Standard The definition of 'port1' in that specification. |
Living Standard | No difference from HTML5 Web Messaging. |
HTML5 Web Messaging The definition of 'port1' in that specification. |
Recommendation | W3C version of the spec |