HTML5 伺服器傳送事件 Server Send

2021-08-05 18:38:24 字數 1505 閱讀 3397

server-send事件指的是網頁自動獲取來自伺服器端的更新。以前也能做到這點，前提是網頁必須詢問是否有可用的更新。通過伺服器傳送事件，更新能夠自動送達。

支援情況：除了ie瀏覽器外，其它主流瀏覽器勻支援伺服器傳送事件。

在書寫**時，首先是檢測瀏覽器是否支援server-send，**如下：

if (typeof(eventsource) !== "undefined")  else
其中，eventsource物件表示伺服器傳送事件例項。用於接收伺服器傳送事件的通知。

eventsource物件用於接收伺服器傳送事件通知。每接收一次更新，就會觸發message事件，新增onmessage事件處理程式，其event物件的data屬性就是所接收的更新資料。

var source = new eventsource("demo_sse.php"); //建立eventsource物件，用於接收伺服器傳送事件通知。規定傳送更新的頁面的url。


source.onmessage = function (event) ;
建立eventsource物件，並規定傳送更新資料的url，本例子中是「demo_sse.php」，也就是從這個url中接收更新資料的。每接收一次伺服器傳送事件通知，就會觸發message事件，為其物件新增onmessage事件處理程式，event.data就是從伺服器器端接收到的資料資訊。

首先建立乙個eventsource物件，並規定傳送更新資料的url。其次，觸發message事件後，為其物件新增onmessage事件處理程式，用於接收更新資料資訊event.data。

最後將這個從伺服器端接收到的更新資料輸出到頁面上。
其中，demo_sse.php檔案的**為：

<?php 


header("content-type: text/event-stream");


header("cache-content: no-cache");


$time = date("r");


echo "data: the server time is: \n\n";


flush();


?>
這個例子是用於顯示本地伺服器的時間更新內容的。

效果如下：

注：本次例子是在2023年8月13日建立的。

HTML 5 伺服器傳送事件

原文 html5 伺服器傳送事件 server sent event 允許網頁獲得來自伺服器的更新。server sent 事件指的是網頁自動獲取來自伺服器的更新。以前也可能做到這一點，前提是網頁不得不詢問是否有可用的更新。通過伺服器傳送事件，更新能夠自動到達。例子 facebook twitter...

HTML 5 伺服器傳送事件

以前也可能做到這一點，前提是網頁不得不詢問是否有可用的更新。通過html5的伺服器傳送事件，能夠自動獲取更新。eventsource物件並不能夠自行設定重新整理時間，這依賴於瀏覽器的具體實現，比如在chrome中的重新整理時間是3秒，但是在firefox中重新整理時間為5秒 header conte...

HTML5 伺服器傳送事件

html5 伺服器傳送事件 server sent event 允許網頁獲得來自伺服器的更新。1.server sent 事件 單向訊息傳遞 server sent 事件指的是網頁自動獲取來自伺服器的更新。以前也可能做到這一點，前提是網頁不得不詢問是否有可用的更新。通過伺服器傳送事件，更新能夠自動到...