DieChannel Messaging API ermöglicht es, dass zwei separate Skripte, die in unterschiedlichen Browserkontexten an dasselbe Dokument angehängt sind (z. B. zwei IFrames oder das Hauptdokument und ein IFrame, zwei Dokumente über einenSharedWorker, oder zwei Worker), direkt miteinander kommunizieren, indem sie Nachrichten über bidirektionale Kanäle (oder Pipes) mit einem Port an jedem Ende austauschen.

Konzepte und Verwendung

Ein Nachrichtenkanal wird mithilfe des KonstruktorsMessageChannel() erstellt. Einmal erstellt, können die beiden Ports des Kanals über die EigenschaftenMessageChannel.port1 undMessageChannel.port2 zugegriffen werden (die beideMessagePort-Objekte zurückgeben.) Die Anwendung, die den Kanal erstellt hat, verwendetport1, und die Anwendung am anderen Ende des Ports verwendetport2 – Sie senden eine Nachricht anport2 und übertragen den Port in den anderen Browserkontext mithilfe vonwindow.postMessage zusammen mit zwei Argumenten (der zu sendenden Nachricht und dem Objekt, dessen Besitz übertragen wird, in diesem Fall der Port selbst.)

Wenn diese übertragbaren Objekte übertragen werden, können sie im ursprünglichen Kontext nicht mehr verwendet werden. Ein Port kann, nachdem er gesendet wurde, vom ursprünglichen Kontext nicht mehr genutzt werden.

Der andere Browserkontext kann die Nachricht mithilfe vononmessage empfangen und den Inhalt der Nachricht anhand desdata-Attributs des Ereignisses erfassen. Sie könnten dann antworten, indem Sie eine Nachricht zurück an das ursprüngliche Dokument mithilfe vonMessagePort.postMessage senden.

Wenn Sie das Senden von Nachrichten über den Kanal beenden möchten, können SieMessagePort.close aufrufen, um die Ports zu schließen.

Erfahren Sie mehr darüber, wie Sie diese API verwenden können, inVerwendung der Nachrichtenkanal-API.

Schnittstellen

MessageChannel

Erstellt einen neuen Nachrichtenkanal zum Senden von Nachrichten.

MessagePort

Steuert die Ports im Nachrichtenkanal und ermöglicht das Senden von Nachrichten von einem Port und das Empfangen dieser am anderen.

Beispiele

• Wir haben einGrundlegendes Demobeispiel für Nachrichtenkanäle auf GitHub veröffentlicht (führen Sie es auch live aus), das einen sehr einfachen Einzelnachrichtentransfer zwischen einer Seite und einem eingebetteten<iframe> zeigt.
• Sie können auch einMultimessaging-Demo sehen (diese live ausführen), das eine etwas komplexere Einrichtung zeigt, die mehrere Nachrichten zwischen Hauptseite und IFrame senden kann.

Spezifikationen

Browser-Kompatibilität

api.MessageChannel

api.MessagePort

Siehe auch

• Verwendung der Nachrichtenkanal-API
• Web Workers API
• Broadcast Channel API