EventSource

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.

* Some parts of this feature may have varying levels of support.

L'interface EventSource est utilisée afin de recevoir des évènements envoyés par le serveur. Elle se connecte à un serveur via HTTP et reçoit des évènements au format text/event-stream avant de clôturer la connexion.

Constructeur

EventSource()

Cette méthode crée un nouvel objet EventSource à partir de l'objet USVString fourni.

Propriétés

Cette interface hérite également des propriétés fournies par l'objet parent : EventTarget.

EventSource.readyState Lecture seule

Un nombre qui représente l'état de la connexion. Les valeurs possibles sont CONNECTING (0) (connexion en cours), OPEN (1) (connexion ouverte), ou CLOSED (2) (connexion fermée).

EventSource.url Lecture seule

Un objet DOMString qui représente l'URL de la source.

EventSource.withCredentials Lecture seule

Un booléen qui indique si l'objet EventSource a été instancié avec les paramètres d'authentification CORS (true) ou non (false, la valeur par défaut).

Gestionnaires d'évènement

EventSource.onerror

Un gestionnaire d'évènement qui est appelé lorsqu'une erreur se produit et que l'évènement error est envoyé à l'objet EventSource.

EventSource.onmessage

Un gestionnaire d'évènement qui est appelé lorsqu'un évènement message est reçu (ce qui signifie qu'on a reçu un message de la source).

EventSource.onopen

Un gestionnaire d'évènement qui est appelé lorsqu'un évènement open est reçu, ce qui indique que la connexion vient d'être ouverte.

Méthodes

Cette interface hérite également de méthodes grâce à son objet parent : EventTarget.

EventSource.close()

Cette méthode ferme la connexion s'il y en a une en cours et change la valeur de l'attribut readyState en CLOSED. Si la connexion est déjà fermée, la méthode ne fait rien.

Exemples

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

evtSource.onmessage = function (e) {
  var newElement = document.createElement("li");

  newElement.textContent = "message: " + e.data;
  eventList.appendChild(newElement);
};

Note : Un exemple complet est disponible sur GitHub, voir la démonstration SSE avec PHP.

Spécifications

Specification
HTML
# the-eventsource-interface

Compatibilité des navigateurs

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
EventSource
EventSource() constructor
options.withCredentials parameter
close
error event
message event
open event
readyState
url
withCredentials
Available in workers

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
Has more compatibility info.

Voir aussi