2016-05-31 14 views
3

Ich bin verwirrt mit postMessage und MessageChannel.In PostMessage und MessageChannel stecken

Hier sind einige Codes von MDN:

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; 
} 

Ich dachte postMessage Methode nur zwei Argumente nehmen, die Codes über die zeigen, dass es drei nehmen kann, aber es gibt nichts über die dritte Argument der postMessage Methode.

So gibt es meine Fragen:

  1. Was ist der Sinn des dritten Argument der postMessage Methode?

  2. ich die Verwendung von MessageChannel wissen, aber es scheint nutzlos, Warum/Wann sollten wir MessageChannel benutzen?

Antwort

3

MessageChannel ist im Grunde eine 2-Wege-Verbindungsleitung. Stellen Sie es sich als Alternative zu window.postMessage/window.onmessage vor - aber etwas einfacher und konfigurierbarer.

This guide erklärt die Bedeutung der postmessage der 3. Parameter:

Ein Objekt, das Eigentum an dem an den Empfangs Browsing Kontext übertragen wird. In diesem Fall übertragen wir MessageChannel.port2 an das IFrame, damit es zum Empfangen der Nachricht von der Hauptseite verwendet werden kann.

P.S. Ich finde this guide from Opera ein bisschen einfacher zu lesen als Mozillas.

+0

löste alle meine Verwirrung, Danke für das Teilen! – huachengzan

Verwandte Themen