Server sent events (sse) с примерами использования

https://developer.mozilla.org/en-US/docs/Server-sent_events/Using_server-sent_events
http://www.html5rocks.com/en/tutorials/eventsource/basics/

Всё сводится к:

на сервере (php)

date_default_timezone_set("America/New_York");
header("Content-Type: text/event-stream\n\n");

$counter = rand(1, 10);
while (1) {
  // Every second, sent a "ping" event.
  
  echo "event: ping\n";
  $curDate = date(DATE_ISO8601);
  echo 'data: {"time": "' . $curDate . '"}';
  echo "\n\n";
  
  // Send a simple message at random intervals.
  
  $counter--;
  
  if (!$counter) {
    echo 'data: This is a message at time ' . $curDate . "\n\n";
    $counter = rand(1, 10);
  }
  
  ob_flush();
  flush();
  sleep(1);
}

date_default_timezone_set("America/New_York");

header("Content-Type: text/event-stream\n\n");

$counter = rand(1, 10);

while (1) {

// Every second, sent a "ping" event.

echo "event: ping\n";

$curDate = date(DATE_ISO8601);

echo 'data: {"time": "' . $curDate . '"}';

echo "\n\n";

// Send a simple message at random intervals.

$counter--;

if (!$counter) {

echo 'data: This is a message at time ' . $curDate . "\n\n";

$counter = rand(1, 10);

}

ob_flush();

flush();

sleep(1);

}

на клиенте

var evtSource = new EventSource("ssedemo.php");

evtSource.onmessage = function(e) {
  var newElement = document.createElement("li");
  
  newElement.innerHTML = "message: " + e.data;
  eventList.appendChild(newElement);
}

evtSource.addEventListener("ping", function(e) {
  var newElement = document.createElement("li");
  
  var obj = JSON.parse(e.data);
  newElement.innerHTML = "ping at " + obj.time;
  eventList.appendChild(newElement);
}, false);

var evtSource = new EventSource("ssedemo.php");

evtSource.onmessage = function(e) {

var newElement = document.createElement("li");

newElement.innerHTML = "message: " + e.data;

eventList.appendChild(newElement);

}

evtSource.addEventListener("ping", function(e) {

var newElement = document.createElement("li");

var obj = JSON.parse(e.data);

newElement.innerHTML = "ping at " + obj.time;

eventList.appendChild(newElement);

}, false);

Server sent events (sse) с примерами использования

Similar Posts

LEAVE A COMMENT Отменить ответ