這篇文章給大家分享的是有關(guān)HTML5中MessageEvent以及SSE的規(guī)范是什么的內(nèi)容。小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過(guò)來(lái)看看吧。
成都創(chuàng)新互聯(lián)公司堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:做網(wǎng)站、成都網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿(mǎn)足客戶(hù)于互聯(lián)網(wǎng)時(shí)代的屯溪網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!1.MessageEvent接口
在HTML5規(guī)范中定義的新的通信方式,無(wú)論是WebSocket還是SSE,包括實(shí)現(xiàn)視頻、音頻通信的WebRTC,都是基于HTML5規(guī)范中定義的一個(gè)接口:MessageEvent。這是一個(gè)基于消息的事件。首先我們可以看一下在JavaScript中,傳統(tǒng)的事件類(lèi)型有哪些。
傳統(tǒng)的DOM事件的基類(lèi)主要包括:
(1)UIEvents:一般化的UI事件,其中鼠標(biāo)事件和鍵盤(pán)事件都繼承自UI事件;
(2)MouseEvents:一般化的鼠標(biāo)事件,比如click事件、mousemove事件等,都是MouseEvents事件類(lèi)型的實(shí)例;
(3)MutationEvents:一般化的DOM變動(dòng)事件;
(4)HTMLEvents:一般化的HTML事件。
而HTML5中新增添的MessageEvent事件,是專(zhuān)門(mén)用來(lái)進(jìn)行事件傳輸?shù)氖录K税珽vent的屬性之外,還包含一些自己特有的屬性。接口具體代碼這里就不貼了,可以查看HTML5規(guī)范的第880頁(yè)查看。
MessageEvent新增的重要屬性包括:
(1)data:這里面存儲(chǔ)的就是服務(wù)器發(fā)送的數(shù)據(jù)
(2)lastEventId:這里面存放的是最后一次的事件ID字符串
除此之外還包括origin、ports、source等屬性。下面通過(guò)對(duì)SSE實(shí)現(xiàn)的分析,了解如何使用MessageEvent。
2、SSE和MessageEvent
SSE客戶(hù)端的實(shí)現(xiàn)就使用了MessageEvent接口。
服務(wù)器在清單中的各個(gè)字段會(huì)按照一種規(guī)則被客戶(hù)端進(jìn)行解讀,其中的id字段就對(duì)應(yīng)著MessageEvent中的lastEventId。其中的data字段定義的數(shù)據(jù)通過(guò)解讀后,就會(huì)被傳送到MessageEvent的data字段,看如下代碼:
var es = new EventSource("test.php"); es.addEventListener("message", function(e){ console.log(e); })
這里面我們直接使用事件對(duì)象的處理方法,在Chrome控制臺(tái)中打印出這個(gè)事件對(duì)象的結(jié)構(gòu)。可以看到該對(duì)象的data字段就是test.php中發(fā)送過(guò)來(lái)的數(shù)據(jù),它的type是message,而其原型繼承的就是MessageEvent。
此外還要注意,SSE服務(wù)器清單中的retry是一個(gè)內(nèi)部屬性,是不能通過(guò)JavaScript代碼獲取的。
3.EventSource接口
我們?cè)赟SE中使用的EventSource接口在HTML5規(guī)范中定義,代碼可見(jiàn)HTML5規(guī)范的第882頁(yè)。
從接口中可以看到,首先是定義的三個(gè)內(nèi)置的事件處理程序:onopen/onmessage/onclose。此外還包括三個(gè)連接的狀態(tài)readyState,CONNECTING表示正在建立連接,可能的情況是連接還沒(méi)建立好或者連接中斷客戶(hù)端正在重連這個(gè)過(guò)程;OPEN表示連接開(kāi)啟可以傳送數(shù)據(jù)的狀態(tài),CLOSED表示連接中斷,并且客戶(hù)端沒(méi)有嘗試重連。其中定義的方法我們可以看到只有close(),用來(lái)關(guān)閉連接。
感謝各位的閱讀!關(guān)于“HTML5中MessageEvent以及SSE的規(guī)范是什么”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!
文章名稱(chēng):HTML5中MessageEvent以及SSE的規(guī)范是什么-創(chuàng)新互聯(lián)
當(dāng)前地址:http://vcdvsql.cn/article30/ddpepo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供服務(wù)器托管、網(wǎng)站改版、網(wǎng)站策劃、營(yíng)銷(xiāo)型網(wǎng)站建設(shè)、微信公眾號(hào)、品牌網(wǎng)站設(shè)計(jì)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容