EventSource: message-Ereignis

Baseline

Weitgehend verfügbar

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

Vollständige Kompatibilität anzeigen
Mehr erfahren

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

Das message-Ereignis der EventSource-Schnittstelle wird ausgelöst, wenn Daten über eine Ereignisquelle empfangen werden.

Dieses Ereignis kann nicht abgebrochen werden und breitet sich nicht nach oben aus.

Syntax

Verwenden Sie den Ereignisnamen in addEventListener():

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

Alternativ können Sie ihn der Event-Handler-Eigenschaft der Schnittstelle zuweisen:

onmessage = (event) => { }

Ereignistyp

Ein MessageEvent. Erbt von Event.

Beispiele

In diesem einfachen Beispiel wird eine EventSource erstellt, um Ereignisse vom Server zu empfangen. Eine Seite namens sse.php erzeugt die Ereignisse.

const evtSource = new EventSource("sse.php");
const eventList = document.querySelector("ul");

evtSource.addEventListener("message", (e) => {
  const newElement = document.createElement("li");

  newElement.textContent = `message: ${e.data}`;
  eventList.appendChild(newElement);
});

Verwendung der Event-Handler-Eigenschaft `onmessage`

Sie können auch die Event-Handler-Eigenschaft onmessage verwenden. Beachten Sie jedoch, dass dadurch andere Ereignis-Listener ersetzt werden, die gegebenenfalls über onmessage hinzugefügt wurden:

evtSource.onmessage = (e) => {
  const newElement = document.createElement("li");

  newElement.textContent = `message: ${e.data}`;
  eventList.appendChild(newElement);
};