MessagePort: messageerror-Ereignis

Baseline 2023

Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

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

Das messageerror-Ereignis wird auf einem MessagePort-Objekt ausgelöst, wenn es eine Nachricht erhält, die nicht deserialisiert werden kann.

Dieses Ereignis kann nicht abgebrochen werden und wird nicht gebubbelt.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener(), oder setzen Sie eine Ereignis-Handler-Eigenschaft.

js
addEventListener("messageerror", (event) => {});

onmessageerror = (event) => {};

Ereignistyp

Ereigniseigenschaften

Diese Schnittstelle erbt auch Eigenschaften von ihrem Elternteil, Event.

MessageEvent.data Schreibgeschützt

Die vom Nachrichtenemitter gesendeten Daten.

MessageEvent.origin Schreibgeschützt

Ein String, der den Ursprung des Nachrichtenemitters darstellt.

MessageEvent.lastEventId Schreibgeschützt

Ein String, der eine eindeutige ID für das Ereignis darstellt.

MessageEvent.source Schreibgeschützt

Ein MessageEventSource (kann ein WindowProxy, MessagePort oder ServiceWorker-Objekt sein), das den Nachrichtenemitter darstellt.

MessageEvent.ports Schreibgeschützt

Ein Array, das alle MessagePort-Objekte enthält, die mit der Nachricht in der entsprechenden Reihenfolge gesendet wurden.

Beispiele

Angenommen, ein Skript erstellt einen MessageChannel und sendet einen der Ports an einen anderen Browser-Kontext, wie z.B. ein anderes <iframe>, mit Code wie diesem:

js
const channel = new MessageChannel();
const myPort = channel.port1;
const targetFrame = window.top.frames[1];
const targetOrigin = "https://example.org";

const messageControl = document.querySelector("#message");
const channelMessageButton = document.querySelector("#channel-message");

channelMessageButton.addEventListener("click", () => {
  myPort.postMessage(messageControl.value);
});

targetFrame.postMessage("init", targetOrigin, [channel.port2]);

Das Ziel kann den Port empfangen und mit Code wie diesem beginnen, Nachrichten und Nachrichtenfehler darauf zu hören:

js
window.addEventListener("message", (event) => {
  const myPort = event.ports[0];

  myPort.addEventListener("message", (event) => {
    received.textContent = event.data;
  });

  myPort.addEventListener("messageerror", (event) => {
    console.error(event.data);
  });

  myPort.start();
});

Beachten Sie, dass der Listener MessagePort.start() aufrufen muss, bevor Nachrichten an diesen Port zugestellt werden. Dies ist nur notwendig, wenn die addEventListener()-Methode verwendet wird: Wenn der Empfänger stattdessen onmessage verwendet, wird start() implizit aufgerufen:

js
window.addEventListener("message", (event) => {
  const myPort = event.ports[0];

  myPort.onmessage = (event) => {
    received.textContent = event.data;
  };

  myPort.onmessageerror = (event) => {
    console.error(event.data);
  };
});

Spezifikationen

Specification
HTML Standard
# event-messageerror
HTML Standard
# handler-messageport-onmessageerror

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch