MessagePort: postMessage()-Methode

Syntax

postMessage(message)
postMessage(message, transfer)
postMessage(message, options)

Parameter

message

Die Nachricht, die Sie über den Kanal senden möchten. Dies kann ein beliebiger Basisdatentyp sein. Mehrere Datenobjekte können als Array gesendet werden.

Hinweis: Ausführungskontexte, die miteinander Nachrichten austauschen können, befinden sich möglicherweise nicht im selben Agenten-Cluster und können daher keinen Speicher teilen. SharedArrayBuffer-Objekte oder Pufferansichten, die durch einen solchen unterstützt werden, können nicht über Agenten-Cluster hinweg gepostet werden. Ein Versuch, dies zu tun, erzeugt ein messageerror-Ereignis, das ein DataCloneError DOMException auf der Empfängerseite enthält.

transfer Optional

Ein optionales Array von übertragbaren Objekten, um deren Eigentum zu übertragen. Das Eigentum an diesen Objekten wird auf die Empfängerseite übertragen und sie sind auf der sendenden Seite nicht mehr verwendbar. Diese übertragbaren Objekte sollten an die Nachricht angehängt werden; andernfalls würden sie verschoben, aber tatsächlich nicht auf der Empfängerseite zugänglich sein.

options Optional

Ein optionales Objekt, das die folgenden Eigenschaften enthält:

transfer Optional

Hat die gleiche Bedeutung wie der transfer-Parameter.

Rückgabewert

Keiner (undefined).

Beispiele

Im folgenden Codeblock sehen Sie, wie ein neuer Kanal unter Verwendung des MessageChannel()-Konstruktors erstellt wird. Wenn das IFrame geladen ist, übergeben wir dem IFrame MessageChannel.port2 zusammen mit einer Nachricht mit Hilfe von window.postMessage. Das IFrame empfängt die Nachricht und sendet mit postMessage() eine Nachricht auf dem MessageChannel zurück. Der handleMessage-Handler reagiert dann auf eine Nachricht, die vom IFrame mit onmessage zurückgesendet wird, indem er sie in einen Absatz einfügt — MessageChannel.port1 wird überwacht, um zu prüfen, wann die Nachricht eintrifft.

const channel = new MessageChannel();
const para = document.querySelector("p");

const ifr = document.querySelector("iframe");
const otherWindow = ifr.contentWindow;

ifr.addEventListener("load", iframeLoaded, false);

function iframeLoaded() {
  otherWindow.postMessage("Transferring message port", "*", [channel.port2]);
}

channel.port1.onmessage = handleMessage;
function handleMessage(e) {
  para.innerHTML = e.data;
}

// in the iframe…

window.addEventListener("message", (event) => {
  const messagePort = event.ports?.[0];
  messagePort.postMessage("Hello from the iframe!");
});

Für ein vollständiges Arbeitsbeispiel sehen Sie sich unser einfaches Channel-Messaging-Demo auf GitHub an (führen Sie es auch live aus).

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Verwendung von Channel Messaging