Computer >> Máy Tính >  >> Lập trình >> HTML

Sự kiện do máy chủ gửi hoạt động như thế nào trong HTML5?


Sự kiện do máy chủ gửi chuẩn hóa cách chúng tôi truyền dữ liệu từ máy chủ đến máy khách. Để sử dụng Sự kiện do máy chủ gửi trong ứng dụng web, bạn cần thêm phần tử vào tài liệu.

Thuộc tính src của phần tử phải trỏ đến một URL sẽ cung cấp kết nối HTTP liên tục để gửi một luồng dữ liệu có chứa các sự kiện.

URL sẽ trỏ đến một PHP, PERL hoặc bất kỳ tập lệnh Python nào sẽ đảm nhận việc gửi dữ liệu sự kiện một cách nhất quán. Sau đây là một ví dụ đơn giản về ứng dụng web yêu cầu thời gian máy chủ.

Sự kiện do máy chủ gửi hoạt động như thế nào trong HTML5?

Bạn có thể thử chạy mã sau để tìm hiểu cách sử dụng Sự kiện do máy chủ gửi trong HTML5

Ví dụ

<!DOCTYPE HTML>
<html>
   <head>
      <script type="text/javascript">
         document.getElementsByTagName("eventsource")[0].addEventListener("server-time", eventHandler, false);
         function eventHandler(event){
            // Alert time sent by the server
            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>

Cuối cùng, sau đây là ticker.cgi được viết bằng perl -

#!/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);
}