baniol
12/9/2013 - 3:34 PM

html5 server sent events, push

html5 server sent events, push

server-sent.php
content_copyfile_download
<?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();
?>
server-sent.js
content_copyfile_download
if (typeof(EventSource) !== "undefined") {
  var source = new EventSource("server.php");
  source.onmessage = function(event) {
    document.getElementById("result").innerHTML += event.data + "<br>";
  };
} else {
  document.getElementById("result").innerHTML = "Sorry, your browser does not support server-sent events...";
}
server-sent.html
content_copyfile_download
<!DOCTYPE html>
<html>
  <head>
    <title>Template html</title>
  </head>
  <body>
    <!-- FROM: http://www.w3schools.com/html/html5_serversentevents.asp -->
    <div id="result"></div>
    <script type="text/javascript" src="script.js"></script>
  </body>
</html>