Pourquoi les événements server-sent ont-ils été introduits dans HTML5?

Pour mettre en place un canal de communication unidirectionnel entre le serveur et le client. Le serveur peut envoyer des données au client à tout moment après l'établissement de la connexion.

Caractéristiques et avantages clés :

• Efficacité : Utilise une connexion HTTP normale, minimisant les coûts par rapport au polling.
• Simplicité : L'API des événements envoyés par le serveur (SSE) est plus simple à utiliser que WebSockets pour une communication unidirectionnelle.
• Reconnexion automatique : Le navigateur tente de se reconnecter automatiquement en cas de coupure de la connexion.
• Support des types de données : Envoi de données textuelles au format text/event-stream.
• Compatibilité avec les navigateurs : Large support par les navigateurs modernes.

Applications :

• Mise à jour en temps réel des flux d'actualités.
• Notifications d'événements (par exemple, nouveaux messages).
• Surveillance des données en temps réel (par exemple, cotations boursières).
• Progrès des tâches longues.

Ceci est une alternative au polling traditionnel, où le client demande périodiquement au serveur s'il y a des mises à jour. Contrairement aux WebSockets, SSE est unidirectionnel, ce qui simplifie leur utilisation lorsque les données ne sont transmises que du serveur au client.

Exemple côté client (JavaScript) :

const eventSource = new EventSource('/events'); // URL pour recevoir les événements du serveur

eventSource.onmessage = function(event) {
  // Traitement des données reçues
  console.log('Message reçu :', event.data);
};

eventSource.onerror = function(error) {
  // Gestion des erreurs de connexion
  console.error('Erreur Server-Sent Events :', error);
};

eventSource.addEventListener('customEvent', function(event) {
  // Traitement de l'événement personnalisé de type 'customEvent'
  console.log('Événement personnalisé reçu :', event.data);
});

Exemple du format de données côté serveur :

event: customEvent
data: {"message": "Bonjour !"}

data: Message texte simple

id: 123 // Identifiant de l'événement, utilisé pour la reconnexion automatique

retry: 5000 // Délai avant la prochaine reconnexion en millisecondes