Sobes.tech
Middle+

Γιατί εισήχθησαν τα γεγονότα server-sent στο HTML5;

sobes.tech AI

Απάντηση από AI

Για την υλοποίηση ενός μονόδρομου καναλιού επικοινωνίας μεταξύ διακομιστή και πελάτη. Ο διακομιστής μπορεί να στέλνει δεδομένα στον πελάτη οποιαδήποτε στιγμή μετά την εγκατάσταση της σύνδεσης.

Κύρια χαρακτηριστικά και πλεονεκτήματα:

  • Αποτελεσματικότητα: Χρησιμοποιείται μια κανονική σύνδεση HTTP, ελαχιστοποιώντας το overhead σε σύγκριση με το polling.
  • Απλότητα: Το API των server-sent events (SSE) είναι πιο απλό στη χρήση από τα WebSockets για μονόδρομη επικοινωνία.
  • Αυτόματη επανασύνδεση: Ο περιηγητής προσπαθεί αυτόματα να επανασυνδεθεί σε περίπτωση διακοπής της σύνδεσης.
  • Υποστήριξη τύπων δεδομένων: Υποστηρίζεται η αποστολή κειμενικών δεδομένων σε μορφή text/event-stream.
  • Υποστήριξη από browsers: Ευρέως υποστηριζόμενο από σύγχρονους browsers.

Εφαρμογές:

  • Ενημερώσεις ροών ειδήσεων σε πραγματικό χρόνο.
  • Ειδοποιήσεις για γεγονότα (π.χ. νέα μηνύματα).
  • Παρακολούθηση δεδομένων σε πραγματικό χρόνο (π.χ. χρηματιστηριακές τιμές).
  • Πρόοδος εκτέλεσης μακροχρόνιων εργασιών.

Αυτή είναι μια εναλλακτική λύση στο παραδοσιακό polling, όπου ο πελάτης ζητά περιοδικά από τον διακομιστή αν υπάρχουν ενημερώσεις. Σε αντίθεση με τα WebSockets, το SSE είναι μονόδρομο, καθιστώντας την εφαρμογή τους πιο απλή όταν τα δεδομένα μεταδίδονται μόνο από τον διακομιστή στον πελάτη.

Παράδειγμα στην πλευρά του πελάτη (JavaScript):

const eventSource = new EventSource('/events'); // URL για λήψη γεγονότων από τον διακομιστή

eventSource.onmessage = function(event) {
  // Επεξεργασία των ληφθέντων δεδομένων
  console.log('Ληφθέν μήνυμα:', event.data);
};

eventSource.onerror = function(error) {
  // Διαχείριση σφαλμάτων σύνδεσης
  console.error('Σφάλμα Server-Sent Events:', error);
};

eventSource.addEventListener('customEvent', function(event) {
  // Επεξεργασία προσαρμοσμένου γεγονότος τύπου 'customEvent'
  console.log('Λήφθηκε προσαρμοσμένο γεγονός:', event.data);
});

Παράδειγμα μορφής δεδομένων στην πλευρά του διακομιστή:

event: customEvent
data: {"message": "Γειά!"}

data: Απλό κείμενο μηνύματος

id: 123 // Αναγνωριστικό γεγονότος, χρησιμοποιείται για αυτόματη επανασύνδεση

retry: 5000 // Καθυστέρηση πριν από την επόμενη επανασύνδεση σε χιλιοστά του δευτερολέπτου