Sobes.tech
Middle

Waarom zijn server-sent gebeurtenissen geïntroduceerd in HTML5?

sobes.tech AI

Antwoord van AI

Server-gestuurde gebeurtenissen (SSE) zijn geïntroduceerd in HTML5 om gegevens van de server naar de client in één richting, in realtime, via een HTTP-verbinding te verzenden. Dit stelt je in staat om updates van de server te ontvangen zonder dat de client voortdurend verzoeken hoeft te sturen (polling). De belangrijkste voordelen ten opzichte van andere technologieën:

  • Eenvoud: Gebruikt een gewone HTTP-verbinding, wat de integratie met bestaande webtechnologieën en infrastructuur vergemakkelijkt.
  • Efficiëntie: Laat de server gegevens sturen wanneer ze klaar zijn, wat de belasting op netwerk en server vermindert in vergelijking met frequente polling.
  • Automatisch opnieuw verbinden: De browser probeert automatisch de verbinding te herstellen bij onderbrekingen.
  • Ingebouwde verwerking: De API EventSource in de browser biedt een eenvoudige interface voor het werken met gebeurtenissen en gegevens.

Voorbeeld van gebruik aan de clientzijde:

// Maak een nieuw EventSource-object aan, met de URL van de server voor SSE
const eventSource = new EventSource('/updates');

// Verwerk het 'message'-evenement - ontvangst van gegevens van de server
eventSource.onmessage = function(event) {
  // Toon de ontvangen gegevens in de console
  console.log('Nieuwe gegevens van de server:', event.data);
};

// Verwerk verbindingsfouten
eventSource.onerror = function(error) {
  console.error('Er is een fout opgetreden:', error);
};

De serverantwoord moet het MIME-type text/event-stream hebben en als volgt worden geformatteerd:

data: Dit is de eerste datalijn\n
data: Dit is de tweede datalijn\n\n

Elk bericht eindigt met twee regeleinden (\n\n). Elke datalijn begint met data: . Er kunnen ook andere velden zijn, zoals event: om het type gebeurtenis aan te geven of id: voor de bericht-ID.

Server-gestuurde gebeurtenissen zijn een goede keuze voor scenario's waarin de server een stroom van updates naar de client moet sturen, zoals meldingen, nieuwskanalen, aandelenkoersen of resultaten van langdurige processen. Ze zijn eenvoudiger te implementeren dan WebSockets voor unidirectionele communicatie.