Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.
MessagePort: postMessage() Methode
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.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die postMessage()-Methode der
MessagePort-Schnittstelle sendet eine Nachricht vom Port und überträgt optional die Eigentumsrechte von Objekten auf andere Browsing-Kontexte.
Syntax
postMessage(message)
postMessage(message, transfer)
postMessage(message, options)
Parameter
message-
Die Nachricht, die Sie über den Kanal senden möchten. Dies kann jeglicher Basisdatentyp sein. Mehrere Datenobjekte können als Array gesendet werden.
Hinweis: Ausführungskontexte, die einander Nachrichten senden können, müssen sich möglicherweise nicht im selben Agenten-Cluster befinden und können daher keinen Speicher teilen.
SharedArrayBuffer-Objekte oder Pufferansichten, die von einem solchen unterstützt werden, können nicht über Agenten-Cluster hinweg gesendet werden. Der Versuch, dies zu tun, wird einmessageerror-Ereignis erzeugen, das einDataCloneErrorDOMExceptionauf der empfangenden Seite enthält. transferOptional-
Ein optionales Array von übertragbaren Objekten, um deren Eigentumsrechte zu übertragen. Das Eigentum dieser Objekte wird auf die Zielseite übertragen und sie sind auf der sendenden Seite nicht mehr verwendbar. Diese übertragbaren Objekte sollten der Nachricht beigefügt werden; andernfalls würden sie verschoben, aber auf der Empfängerseite nicht tatsächlich zugänglich sein.
optionsOptional-
Ein optionales Objekt, das die folgenden Eigenschaften enthält:
transferOptional-
Hat die gleiche Bedeutung wie der
transfer-Parameter.
Rückgabewert
Keiner (undefined).
Beispiele
Im folgenden Codeblock sehen Sie, wie ein neuer Kanal mithilfe des
MessageChannel()-Konstruktors erstellt wird. Wenn das
IFrame geladen ist, übergeben wir MessageChannel.port2 an das IFrame mithilfe von
window.postMessage zusammen mit einer Nachricht. Das iframe empfängt die Nachricht
und sendet eine Nachricht zurück über den MessageChannel mit postMessage().
Der handleMessage-Handler reagiert dann auf eine Nachricht vom IFrame über
onmessage, indem er sie in einen Absatz einfügt —
MessageChannel.port1 wird überwacht, um zu prüfen, wann die Nachricht ankommt.
const channel = new MessageChannel();
const para = document.querySelector("p");
const ifr = document.querySelector("iframe");
const otherWindow = ifr.contentWindow;
ifr.addEventListener("load", iframeLoaded);
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 funktionierendes Beispiel siehe unser Grundlegendes Demo zur Kanalnachrichtenübermittlung auf GitHub (auch live ausführen).
Spezifikationen
| Specification |
|---|
| HTML> # dom-messageport-postmessage-dev> |
Browser-Kompatibilität
Loading...