MessageChannel
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.
A interface MessageChannel
da API Channel Messaging nos permite criar um novo canal de mensagem e enviar os dados através de suas duas propriedades MessagePort
.
Note: This feature is available in Web Workers.
Propriedades
MessageChannel.port1
Somente leitura-
Retorna port1 do canal.
MessageChannel.port2
Somente leitura-
Retorna port2 do canal.
Construtor
MessageChannel()
-
Retorna um novo objeto
MessageChannel
com dois novos objetosMessagePort
.
Exemplo
No seguinte bloco de codigo, você pode ver um novo canal sendo criado usando o construtor MessageChannel()
. Quando o <iframe>
tiver carregado, nos passamos o MessageChannel.port2
para o <iframe>
usando MessagePort.postMessage
juntamente com uma mensagem. O manipulador handleMessage
então reponde à mensagem que foi enviada de volta do <iframe>
(using MessagePort.onmessage
), colocando-o em um parágrafo.
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;
}
Para um exemplo completo, veja nosso channel messaging basic demo no Github (rode online também ).
Especificações
Specification |
---|
HTML Standard # message-channels |
Compatibilidade com navegadores
BCD tables only load in the browser