Server-Sent Events (SSE)

Ce billet date de plusieurs années, ses informations peuvent être devenues obsolètes.

Ce billet fait partie d'une série en 10 volets : #1, #2, #3, #4, #5, #6, #7, #8, #9 et #10.

Notes de lecture de Server-Sent Events (SSE).

L'API des Server-Sent Events ressemble beaucoup au long-polling XHR. Avec le passage d'Internet Explorer à Chromium, son support va devenir bien meilleur.

L'idée est d'établir une connexion HTTP longue durée depuis le client vers le serveur pour que ce dernier puisse ensuite envoyer des données au client par morceaux. Si la connexion est coupée, elle est rétablie automatiquement par le navigateur. La communication une fois établie est donc unidirectionnelle, du serveur vers le client.

L'API Server-Sent Events contient deux composants :

  • une interface EventSource dans le navigateur qui permet au client de recevoir des "notifications push" via des événements DOM
  • et le protocole Event Stream avec le type MIME text/event-stream et le format textuel des données transférées en UTF-8

SSE permet de traiter efficacement les données en temps réel dans le navigateur :

  • faible latence grâce à une connexion HTTP unique de longue durée
  • les messages peuvent être poussés dès qu'ils sont disponibles sur le serveur
  • suivi du dernier message vu et rétablissement automatique de la connexion
  • les nouveaux messages sont notifiés au client par des événements DOM

Le protocole Event Stream est spécifiquement conçu pour transférer des données textuelles au format UTF-8.

Cette limitation peut être contournée au niveau applicatif : une notification textuelle de la disponibilité d'un fichier binaire est envoyée via SSE, puis l'application émet une requête XHR pour le récupérer.

Le premier réflexe de la plupart des développeurs est de se tourner vers les WebSockets dès qu'il faut mettre à jour le client en continu depuis le serveur. Tant qu'il n'y a pas besoin de faire de l'édition collaborative ou du multi-joueur en temps réel, les Server-Sent Events sont très probablement une solution beaucoup plus simple à mettre en place.

Avant XMLHttpRequest Après WebSockets

Tag Kemar Joint