AdNow

loading...

Eventos enviados por el servidor HTML5

Eventos enviados por el servidorHTML5


Los eventos enviados por el servidor permiten que una página web obtenga actualizaciones de un servidor.

Eventos enviados por el servidor - Mensajería unidireccional

Un evento enviado por el servidor es cuando una página web recibe actualizaciones automáticamente de un servidor.
Esto también fue posible antes, pero la página web debería preguntar si había actualizaciones disponibles. Con los eventos enviados por el servidor, las actualizaciones vienen automáticamente.
Ejemplos: actualizaciones de Facebook / Twitter, actualizaciones de precios de acciones, noticias, deportes, etc.

Soporte del navegador

Los números en la tabla especifican la primera versión del navegador que admite completamente los eventos enviados por el servidor.
API
SSE6.0Not supported6.05.011.5

Recibir notificaciones de eventos enviados por el servidor

El objeto EventSource se usa para recibir notificaciones de eventos enviados por el servidor:

Ejemplo

var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
    document.getElementById("result").innerHTML += event.data + "<br>";
};
Pruebelo usted mismo »
Ejemplo explicado:
  • Cree un nuevo objeto EventSource y especifique la URL de la página que envía las actualizaciones (en este ejemplo, "demo_sse.php")
  • Cada vez que se recibe una actualización, se produce el evento onmessage
  • Cuando se produce un evento onmessage, coloque los datos recibidos en el elemento con id = "result"

Comprobar soporte de eventos enviados por el servidor

En el ejemplo de tryit anterior, había algunas líneas adicionales de código para verificar el soporte del navegador para los eventos enviados por el servidor:
if(typeof(EventSource) !== "undefined") {
    // Yes! Server-sent events support!    // Some code.....} else {
    // Sorry! No server-sent events support..}


Ejemplo de código del lado del servidor

Para que el ejemplo anterior funcione, necesita un servidor capaz de enviar actualizaciones de datos (como PHP o ASP).
La sintaxis de la secuencia de eventos del lado del servidor es simple. Establezca el encabezado "Content-Type" en "text / event-stream". Ahora puede comenzar a enviar secuencias de eventos.
Código en PHP (demo_sse.php):
<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');

$time = date('r');
echo "data: The server time is: {$time}\n\n";
flush();
?>
Código en ASP (VB) (demo_sse.asp):
<%
Response.ContentType = "text/event-stream"
Response.Expires = -1
Response.Write("data: The server time is: " & now())
Response.Flush()
%>
Código explicado:
  • Establezca el encabezado "Content-Type" en "text / event-stream"
  • Especifique que la página no debe almacenar en caché
  • Salida de los datos a enviar ( Siempre comience con "datos:")
  • Vacíe los datos de salida de vuelta a la página web

El objeto EventSource

En los ejemplos anteriores, utilizamos el evento onmessage para obtener mensajes. Pero otros eventos también están disponibles:
EventsDescription
onopenWhen a connection to the server is opened
onmessageWhen a message is received
onerrorWhen an error occurs

Formulario de contacto

Nombre

Correo electrónico *

Mensaje *

Entradas más populares de este blog

Listado pasaporte y cedulas SAIME 2018

Etiqueta HTML < abbr >

HTML < a > tag

Visitas a este blog