Server-sent events (SSE) введены в HTML5 для передачи данных с сервера клиенту в одностороннем порядке, в режиме реального времени, по HTTP-соединению. Это позволяет получать обновления от сервера без необходимости клиента постоянно отправлять запросы (полинг). Основные преимущества по сравнению с другими технологиями:

Простота: Используют обычное HTTP-соединение, что упрощает интеграцию с существующими веб-технологиями и инфраструктурой.
Эффективность: Позволяют серверу отправлять данные, когда они готовы, снижая нагрузку на сеть и сервер по сравнению с частым полингом.
Автоматическое переподключение: Браузер автоматически пытается восстановить соединение при разрыве.
Встроенная обработка: API EventSource в браузере предоставляет простой интерфейс для работы с событиями и данными.

Пример использования на клиенте:

// Создаем новый объект EventSource, указывая URL сервера для SSE
const eventSource = new EventSource('/updates');

// Обрабатываем событие 'message' - получение данных от сервера
eventSource.onmessage = function(event) {
  // Выводим полученные данные в консоль
  console.log('Новые данные от сервера:', event.data);
};

// Обрабатываем ошибку соединения
eventSource.onerror = function(error) {
  console.error('Произошла ошибка:', error);
};

На сервере ответ должен иметь MIME-тип text/event-stream и форматироваться следующим образом:

data: Это первая строка данных\n
data: Это вторая строка\n\n

Каждое сообщение заканчивается двумя символами перевода строки (\n\n). Каждая строка данных начинается с data: . Могут быть и другие поля, например, event: для указания типа события или id: для идентификатора сообщения.

Server-sent events являются хорошим выбором для сценариев, где сервер должен отправлять клиенту поток обновлений, таких как уведомления, ленты новостей, котировки акций или результаты долго выполняющихся процессов. Они проще в реализации, чем WebSockets, для однонаправленной связи.

Зачем в HTML5 введены события server-sent?