Sobes.tech
Middle+

Kodėl HTML5 buvo įvesti server-sent įvykiai?

sobes.tech AI

Atsakymas iš AI

Vienpusio ryšio kanalo įgyvendinimui tarp serverio ir kliento, serveris gali siųsti duomenis klientui bet kuriuo metu po ryšio užmezgimo:

Pagrindinės savybės ir pranašumai:

  • efektyvumas: naudojamas įprastas HTTP ryšys, sumažinant išlaidas lyginant su polling
  • paprastumas: server-sent events (SSE) API yra paprastesnis naudoti nei WebSockets vienpusiam ryšiui
  • automatinis prisijungimo atnaujinimas: naršyklė automatiškai bando prisijungti iš naujo po ryšio nutraukimo
  • duomenų tipų palaikymas: palaikomas teksto duomenų siuntimas text/event-stream formatu
  • naršyklių palaikymas: plačiai palaikomas šiuolaikinių naršyklių

Naudojimas:

  • naujienų srautų atnaujinimas realiu laiku
  • įvykių pranešimai (pavyzdžiui, naujos žinutės)
  • duomenų stebėjimas realiu laiku (pavyzdžiui, biržos kotiruotės)
  • ilgalaikių užduočių progresas

Tai alternatyva tradiciniam polling, kai klientas periodiškai klausia serverio apie naujienas. Skirtingai nuo WebSockets, SSE yra vienpusis, todėl jų taikymas yra paprastesnis, kai duomenys perduodami tik iš serverio į klientą.

Kliento pusėje (JavaScript) pavyzdys:

const eventSource = new EventSource('/events'); // URL, skirtas gauti įvykius iš serverio

eventSource.onmessage = function(event) {
  // gautų duomenų apdorojimas
  console.log('Gauta žinutė:', event.data);
};

eventSource.onerror = function(error) {
  // ryšio klaidų apdorojimas
  console.error('Server-Sent Events klaida:', error);
};

eventSource.addEventListener('customEvent', function(event) {
  // apdoroti specialų įvykį, kurio tipas 'customEvent'
  console.log('Gautas specialus įvykis:', event.data);
});

Serverio pusėje duomenų formato pavyzdys:

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

data: Paprasta žinutė

id: 123 // įvykio identifikatorius, naudojamas automatinio prisijungimo atnaujinimui

retry: 5000 // laiko tarpas prieš kitą prisijungimą milisekundėmis