¿Por qué se introdujeron los eventos server-sent en HTML5?

Los eventos enviados por el servidor (SSE) se introdujeron en HTML5 para transmitir datos desde el servidor al cliente en una sola dirección, en tiempo real, a través de una conexión HTTP. Esto permite recibir actualizaciones del servidor sin que el cliente tenga que enviar solicitudes constantemente (sondeo). Las principales ventajas en comparación con otras tecnologías:

• Simplicidad: Utilizan una conexión HTTP normal, lo que facilita la integración con tecnologías e infraestructura web existentes.
• Eficiencia: Permiten que el servidor envíe datos cuando están listos, reduciendo la carga en la red y en el servidor en comparación con el sondeo frecuente.
• Reconexión automática: El navegador intenta automáticamente restablecer la conexión en caso de interrupción.
• Procesamiento incorporado: La API EventSource en el navegador proporciona una interfaz sencilla para trabajar con eventos y datos.

Ejemplo de uso en el cliente:

// Crear un nuevo objeto EventSource, indicando la URL del servidor para SSE
const eventSource = new EventSource('/updates');

// Procesar el evento 'message' - recepción de datos del servidor
eventSource.onmessage = function(event) {
  // Mostrar los datos recibidos en la consola
  console.log('Nuevos datos del servidor:', event.data);
};

// Procesar errores de conexión
eventSource.onerror = function(error) {
  console.error('Ocurrió un error:', error);
};

En el servidor, la respuesta debe tener el tipo MIME text/event-stream y formatearse de la siguiente manera:

data: Esta es la primera línea de datos\n
data: Esta es la segunda línea\n\n

Cada mensaje termina con dos caracteres de salto de línea (\n\n). Cada línea de datos comienza con data: . También pueden existir otros campos, como event: para indicar el tipo de evento o id: para el identificador del mensaje.

Los eventos enviados por el servidor son una buena opción para escenarios donde el servidor debe enviar un flujo de actualizaciones al cliente, como notificaciones, feeds de noticias, cotizaciones bursátiles o resultados de procesos de larga duración. Son más sencillos de implementar que WebSockets para comunicación unidireccional.