SSE事件作用,错误分析
Server-Sent(SSE):
server sent用于自動接收服務(wù)器更新,當服務(wù)器發(fā)生數(shù)據(jù)更新時,此事件將自動執(zhí)行來更新頁面數(shù)據(jù),常用于博文、股價等不斷變化的項目中。下面將簡單介紹SSE中三個常用事件:
onopen,當通往服務(wù)器的鏈接被打開時執(zhí)行處理函數(shù);
onerror,當服務(wù)端發(fā)生錯誤時,執(zhí)行處理函數(shù);
onmessage,當服務(wù)端發(fā)生變化時執(zhí)行處理函數(shù);
首先創(chuàng)建一個實例對象如:new EventSource(‘test.php’),實例對象括號中用于傳入一個服務(wù)端文件,用于此對象中onmessage事件對象處理,事件對象中data屬性就是接收到服務(wù)端變化后的數(shù)據(jù),事件對象如下:
服務(wù)端數(shù)據(jù)每更新一次,就會自動執(zhí)行onmessage事件,具體如下:
javascript腳本:
<script>// 1.創(chuàng)建EventSource對象:var source = new EventSource('test.php'); //將服務(wù)端的腳本地址傳入到對象中// 2.使用source對象的onmessage事件監(jiān)聽服務(wù)端數(shù)據(jù)變化,并通過事件對象將變化后的數(shù)據(jù)打印在控制臺:source.onmessage = function(event) {console.log(event.data); //將服務(wù)端變化的數(shù)據(jù)打印到控制臺}</script>服務(wù)端文件可以是Java、none.js、php等腳本,這采用php文本介紹SSE,php在本文不做詳細介紹,后面會有相關(guān)文檔詳細介紹:
<!-- 創(chuàng)建一個php文檔,將文件放到與test.html文件同目錄--><?phpheader('Content-Type: text/event-stream');//設(shè)置header,后面php會詳細介紹$time = date('r');//定義變量接收當前時間echo "data:{$time}\n\n";//將變化的時間輸出注意:此案例應(yīng)該和web Worker一樣部署在服務(wù)器上才能正常運行,否則會報類似錯誤:Access to resource at ‘file:///C:/Users/17121/Desktop/test/test.php’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https.;實際開發(fā)中應(yīng)當判斷瀏覽器是否支持EventSource對象,當不支持時應(yīng)當做出錯誤提示。
提示:本文圖片等素材來源于網(wǎng)絡(luò),若有侵權(quán),請發(fā)郵件至郵箱:810665436@qq.com聯(lián)系筆者 刪除。
筆者:苦海
總結(jié)
以上是生活随笔為你收集整理的SSE事件作用,错误分析的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 初识java中数组、数组在内存中、越界异
- 下一篇: ora 00900 已编译但有错误_技术