服务器发送的事件如何在HTML5中工作？

服务器发送的事件标准化了我们如何将数据从服务器流传输到客户端。要在Web应用程序中使用服务器发送的事件，您需要在文档中添加<eventsource>元素。

<eventsource>元素的src属性应该指向一个URL，该URL应该提供一个持久的HTTP连接，该连接发送包含事件的数据流。

URL将指向PHP，PERL或任何Python脚本，这些脚本将始终如一地发送事件数据。以下是一个Web应用程序的简单示例，该示例可能需要服务器时间。

您可以尝试运行以下代码，以了解如何在HTML5中使用服务器发送的事件

示例

<!DOCTYPE HTML>
<html>
   <head>
      <script type="text/javascript">
         document.getElementsByTagName("eventsource")[0].addEventListener("server-time", eventHandler, false);
         function eventHandler(event){
            //服务器发送的警报时间
            document.querySelector('#ticker').innerHTML = event.data;
         }
      </script>
   </head>
   <body>
      <div id="sse">
         <eventsource src="/cgi-bin/ticker.cgi" />
      </div>
      <div id="ticker" name="ticker">
         [TIME]
      </div>
   </body>
</html>

最后，下面是用perl编写的ticker.cgi-

#!/usr/bin/perl
print "Content-Type: text/event-stream\n\n";
while(true){
   print "Event: server-time\n";
   $time = localtime();
   print "Data: $time\n";
   sleep(5);
}

基础教程