Miért vezették be a server-sent eseményeket az HTML5-ben?

A szerver és a kliens közötti egyirányú kommunikációs csatorna megvalósításához. A szerver bármikor küldhet adatokat a kliensnek a kapcsolat létesítése után.

Fő jellemzők és előnyök:

• Hatékonyság: Egy normál HTTP kapcsolatot használ, minimalizálva a túlterhelést a pollinghoz képest.
• Egyszerűség: A szerver-szintű események (SSE) API-ja egyszerűbb, mint a WebSocket, egyirányú kommunikációhoz.
• Automatikus újracsatlakozás: A böngésző automatikusan megpróbál újracsatlakozni, ha a kapcsolat megszakad.
• Adattípus támogatás: Szöveges adatok küldése a text/event-stream formátumban támogatott.
• Böngésző támogatás: Modern böngészők széles körben támogatják.

Alkalmazások:

• Hírcsatornák valós idejű frissítése.
• Eseményértesítések (pl. új üzenetek).
• Adatok valós idejű monitorozása (pl. tőzsdei árfolyamok).
• Hosszú futó feladatok előrehaladása.

Ez egy alternatíva a hagyományos pollinghoz, ahol a kliens időszakosan kérdezi a szervert, hogy van-e frissítés. A WebSocket-től eltérően az SSE egyirányú, ami egyszerűsíti a használatát, amikor az adatok csak a szerverről a kliens felé kerülnek továbbításra.

Példa kliens oldali (JavaScript):

const eventSource = new EventSource('/events'); // URL a szerver eseményeinek fogadására

eventSource.onmessage = function(event) {
  // A kapott adatok feldolgozása
  console.log('Üzenet érkezett:', event.data);
};

eventSource.onerror = function(error) {
  // Kapcsolati hibák kezelése
  console.error('Server-Sent Events hiba:', error);
};

eventSource.addEventListener('customEvent', function(event) {
  // Egyedi esemény kezelése 'customEvent' típusban
  console.log('Egyedi esemény érkezett:', event.data);
});

Szerver oldali adatformátum példája:

event: customEvent
data: {"message": "Helló!"}

data: Egyszerű szöveges üzenet

id: 123 // Eseményazonosító, az automatikus újracsatlakozáshoz használható

retry: 5000 // Várakozási idő a következő újracsatlakozás előtt milliszekundumban