RTCDataChannel: message Ereignis

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das WebRTC-message-Ereignis wird an den onmessage-Ereignishandler auf einem RTCDataChannel-Objekt gesendet, wenn eine Nachricht von der entfernten Gegenstelle empfangen wurde.

Hinweis: Das message-Ereignis verwendet als sein Ereignisobjekttyp die MessageEvent-Schnittstelle, die von der HTML-Spezifikation definiert wird.

Dieses Ereignis ist nicht abbruchbar und wird nicht weitergeleitet.

Syntax

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

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

onmessage = (event) => {};

Ereignistyp

Ereigniseigenschaften

Erbt auch Eigenschaften von seiner Elternschnittstelle, Event.

MessageEvent.data Nur lesbar

Die vom Nachrichtensender gesendeten Daten.

MessageEvent.origin Nur lesbar

Ein String, der den Ursprung des Nachrichtensenders repräsentiert.

MessageEvent.lastEventId Nur lesbar

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

MessageEvent.source Nur lesbar

Eine Referenz auf den Nachrichtensender, eines der WindowProxy, MessagePort oder ServiceWorker.

MessageEvent.ports Nur lesbar

Ein Array von MessagePort-Objekten, das die Ports darstellt, die mit dem Kanal verbunden sind, über den die Nachricht gesendet wird (wo zutreffend, z. B. in der Kanalkommunikation oder beim Senden einer Nachricht an einen gemeinsamen Worker).

Beispiele

Für ein gegebenes RTCDataChannel, dc, das für eine Peer-Verbindung mit seiner createDataChannel()-Methode erstellt wurde, richtet dieser Code einen Handler für eingehende Nachrichten ein und bearbeitet sie, indem er die in der Nachricht enthaltenen Daten als neues <p> (Absatz)-Element zum aktuellen Dokument hinzufügt.

js
dc.addEventListener(
  "message",
  (event) => {
    let newParagraph = document.createElement("p");
    let textNode = document.createTextNode(event.data);
    newParagraph.appendChild(textNode);

    document.body.appendChild(newParagraph);
  },
  false,
);

Zuerst erstellen wir das neue Absatz-Element und fügen die Nachrichtendaten als neuen Textknoten hinzu. Dann fügen wir den neuen Absatz am Ende des Body-Dokuments an.

Sie können auch die onmessage-Ereignishandler-Eigenschaft eines RTCDataChannel-Objekts verwenden, um den Ereignishandler festzulegen:

js
dc.onmessage = (event) => {
  let newParagraph = document.createElement("p");
  let textNode = document.createTextNode(event.data);
  newParagraph.appendChild(textNode);

  document.body.appendChild(newParagraph);
};

Spezifikationen

Specification
WebRTC: Real-Time Communication in Browsers
# event-datachannel-message
WebRTC: Real-Time Communication in Browsers
# dom-rtcdatachannel-onmessage

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch