MessageChannel

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit September 2015 browserübergreifend verfügbar.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das MessageChannel-Interface der Channel Messaging API ermöglicht es uns, einen neuen Nachrichtenkanal zu erstellen und Daten über seine beiden MessagePort-Eigenschaften zu senden.

In diesem Artikel

Konstruktor

MessageChannel()

Gibt ein neues MessageChannel-Objekt mit zwei neuen MessagePort-Objekten zurück.

Instanzeigenschaften

MessageChannel.port1 Schreibgeschützt

Gibt port1 des Kanals zurück.

MessageChannel.port2 Schreibgeschützt

Gibt port2 des Kanals zurück.

Beispiel

Im folgenden Beispiel sehen Sie, wie ein neuer Kanal mit Hilfe des MessageChannel()-Konstruktors erstellt wird.

Wenn das IFrame geladen ist, registrieren wir einen onmessage-Handler für MessageChannel.port1 und übertragen MessageChannel.port2 zusammen mit einer Nachricht an das IFrame über die Methode window.postMessage.

Wenn eine Nachricht vom IFrame zurückgesendet wird, gibt die Funktion onMessage die Nachricht in einem Absatz aus.

js
const channel = new MessageChannel();
const output = document.querySelector(".output");
const iframe = document.querySelector("iframe");

// Wait for the iframe to load
iframe.addEventListener("load", onLoad);

function onLoad() {
  // Listen for messages on port1
  channel.port1.onmessage = onMessage;

  // Transfer port2 to the iframe
  iframe.contentWindow.postMessage("Hello from the main page!", "*", [
    channel.port2,
  ]);
}

// Handle messages received on port1
function onMessage(e) {
  output.innerHTML = e.data;
}

Ein komplett funktionierendes Beispiel finden Sie in unserem Grunddemonstrationsprojekt zur Kanalnachrichtübermittlung auf GitHub (auch live ausführen).

Verwendung von Kanalnachrichten

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Channel Messaging API
MessageChannel
Konstruktor
1. MessageChannel()
Instanzeigenschaften
1. port1
2. port2
Verwandte Seiten für Channel Messaging API
1. MessagePort
Anleitungen
1. Verwendung von Kanalnachrichten

MessageChannel

In diesem Artikel

Konstruktor

Instanzeigenschaften

Beispiel

Spezifikationen

Browser-Kompatibilität

Siehe auch

Help improve MDN