廖海波，杜 亮，鄭方雄，沈心怡，蔣 媛

(重慶郵電大學(xué) 工業(yè)物聯(lián)網(wǎng)與網(wǎng)絡(luò)化控制教育部重點(diǎn)實(shí)驗(yàn)室，重慶 400065)

WebSocket在智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)中的研究與應(yīng)用

廖海波，杜 亮，鄭方雄，沈心怡，蔣 媛

(重慶郵電大學(xué) 工業(yè)物聯(lián)網(wǎng)與網(wǎng)絡(luò)化控制教育部重點(diǎn)實(shí)驗(yàn)室，重慶 400065)

為了改善目前智能家居Web應(yīng)用數(shù)據(jù)交互的實(shí)時(shí)性和帶寬資源浪費(fèi)的問(wèn)題，通過(guò)對(duì)Ajax輪詢技術(shù)與WebSocket技術(shù)在B/S模型下性能分析比較，提出在智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)中引用WebSoket技術(shù)進(jìn)行數(shù)據(jù)交互的方法，從而實(shí)現(xiàn)Web端數(shù)據(jù)的實(shí)時(shí)更新顯示。并在實(shí)例中通過(guò)JAVA后臺(tái)技術(shù)實(shí)現(xiàn)數(shù)據(jù)的可靠傳輸，證明了此方法的可行性。

智能家居；WebSocket; 輪詢；JAVA后臺(tái)

0 引言

隨著Web3.0的到來(lái)，HTML5的飛速發(fā)展，瀏覽器的功能日益增強(qiáng)，Web應(yīng)用的流暢性和用戶體驗(yàn)性已越來(lái)越不輸原生的APP應(yīng)用[1-2]，再加上Web應(yīng)用天然的跨平臺(tái)性和服務(wù)器動(dòng)態(tài)更新功能，使得基于B/S模型的智能家居Web應(yīng)用成為未來(lái)智能家居應(yīng)用主流模式的可能。智能家居Web應(yīng)用的重要部分之一是數(shù)據(jù)呈現(xiàn)的實(shí)時(shí)性[3-5]，在已往的Web應(yīng)用設(shè)計(jì)之中通常使用Ajax來(lái)進(jìn)行數(shù)據(jù)的實(shí)時(shí)更新，但這種通過(guò)輪詢(Polling)來(lái)不斷請(qǐng)求服務(wù)器應(yīng)答的方式會(huì)造成大量的資源浪費(fèi)，特別是每次HTTP請(qǐng)求的HEADER會(huì)占用很多的帶寬，對(duì)整個(gè)Web應(yīng)用的性能會(huì)產(chǎn)生一定的影響[6]。因此，本文引進(jìn)了一種新的前后臺(tái)交互技術(shù)——WebSocket，來(lái)解決Ajax產(chǎn)生的不足，進(jìn)而提高智能家居Web應(yīng)用的性能。

1 WebSocket概述

WebSocket是由HTML5提供的用于Web端與服務(wù)端之間全雙工通信的網(wǎng)絡(luò)通信技術(shù)。

2011年,互聯(lián)網(wǎng)工程任務(wù)組(IETF)標(biāo)準(zhǔn)化了WebSocket協(xié)議并寫(xiě)入RFC6455草案中，萬(wàn)維網(wǎng)聯(lián)盟(W3C)標(biāo)準(zhǔn)化了WebSocket協(xié)議在HTML5規(guī)范中的API接口[7]。WebSocket的使用非常靈巧，Web端與服務(wù)端只需進(jìn)行一次簡(jiǎn)單的握手連接，它們之間就形成一條專用通道，兩者就可以直接進(jìn)行數(shù)據(jù)互相傳送。

傳統(tǒng)的提供Web應(yīng)用實(shí)時(shí)數(shù)據(jù)更新的方法主要有輪詢和其他的服務(wù)器推送技術(shù)，比較流行的是Comnet技術(shù)。Comnet通常利用長(zhǎng)輪詢(Long polling)或流連接策略將半雙工通信模擬成HTTP上的全雙工通信。雖然這種模擬的全雙工通信實(shí)現(xiàn)了數(shù)據(jù)的實(shí)時(shí)性，但是實(shí)時(shí)數(shù)據(jù)是不可預(yù)測(cè)的，不可避免地會(huì)產(chǎn)生一些不必要的請(qǐng)求，造成大量的資源浪費(fèi)。而WebSocket是基于事件觸發(fā)的全雙工通信網(wǎng)絡(luò)技術(shù)，它比輪詢有更小的延時(shí)，從而擁有更高的實(shí)時(shí)性。

WebSocket與輪詢之間的延時(shí)對(duì)比如圖1所示。從圖1可以看出，輪詢方式每次響應(yīng)消息之前都必須進(jìn)行一次請(qǐng)求，每次請(qǐng)求都將消耗額外的時(shí)間。而在WebSocket方式下，服務(wù)端與Web端只需進(jìn)行一次請(qǐng)求握手連接，連接成功之后，Web端就可以在不用請(qǐng)求服務(wù)的情況下獲得服務(wù)端發(fā)送的消息。

2 WebSocket應(yīng)用設(shè)計(jì)

2.1 系統(tǒng)結(jié)構(gòu)

智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)主要由智能醫(yī)療、家電控制、環(huán)境監(jiān)測(cè)、安防報(bào)警和能耗管理[8-9]五大部分組成。各底層傳感器設(shè)備通過(guò)無(wú)線傳感器協(xié)議(ZigBee、6LowPan等)將數(shù)據(jù)上傳給家庭網(wǎng)關(guān)，家庭網(wǎng)關(guān)通過(guò)Socket通信將數(shù)據(jù)轉(zhuǎn)發(fā)給服務(wù)器，服務(wù)器則將數(shù)據(jù)進(jìn)行分析保存到數(shù)據(jù)庫(kù)中，并作Web發(fā)布或消息推送給手機(jī)APP。系統(tǒng)結(jié)構(gòu)如圖2所示。

圖1 WebSocket與Polling延時(shí)對(duì)比圖

圖3 服務(wù)端與Web端交互流程圖

圖2 智能家居系統(tǒng)結(jié)構(gòu)圖

2.2 WebSocket實(shí)時(shí)數(shù)據(jù)更新設(shè)計(jì)

智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)需要進(jìn)行實(shí)時(shí)更新的數(shù)據(jù)有智能醫(yī)療類的人體檢測(cè)數(shù)據(jù)、能耗數(shù)據(jù)、環(huán)境類數(shù)據(jù)和安防類數(shù)據(jù)。傳統(tǒng)的基于Ajax的輪詢方式進(jìn)行更新數(shù)據(jù)需要后臺(tái)程序?qū)⒔邮盏降臄?shù)據(jù)首先存入數(shù)據(jù)庫(kù)，當(dāng)前端發(fā)過(guò)來(lái)HTTP請(qǐng)求之后，再?gòu)臄?shù)據(jù)庫(kù)中取出數(shù)據(jù)并封裝成XML或Json的格式傳回前端頁(yè)面。而WebSocket技術(shù)只需要服務(wù)器與瀏覽器建立WebSocket連接，當(dāng)有數(shù)據(jù)接收到時(shí)即可將接收到的數(shù)據(jù)推送給Web端。這就省去了數(shù)據(jù)先入庫(kù)再讀取消耗的時(shí)間，增強(qiáng)了數(shù)據(jù)實(shí)時(shí)性。

為了實(shí)現(xiàn)WebSocket通信，系統(tǒng)使用JAVA編程語(yǔ)言編寫(xiě)WebSocket的服務(wù)端程序。在設(shè)計(jì)過(guò)程中，采用映射內(nèi)存的方式實(shí)現(xiàn)進(jìn)程間的數(shù)據(jù)共享;使用JAVA多線程連接技術(shù)，監(jiān)聽(tīng)來(lái)自Web端WebSocket對(duì)象的連接請(qǐng)求。當(dāng)Web端向服務(wù)端發(fā)出一個(gè)連接請(qǐng)求時(shí)，服務(wù)端需要解析Web端的WebSocket握手信息，將HTTP協(xié)議升級(jí)到WebSocket協(xié)議并向客戶端返回應(yīng)答信息。服務(wù)端與Web端交互流程如圖3所示。

整個(gè)系統(tǒng)由Web端、WebSocket服務(wù)端和UDPServer服務(wù)端三部分組成。UDPServer開(kāi)始執(zhí)行后將通過(guò)阻塞的方式接收來(lái)自家庭網(wǎng)關(guān)發(fā)來(lái)的數(shù)據(jù)，并將數(shù)據(jù)進(jìn)行解析，重要的數(shù)據(jù)將保存到數(shù)據(jù)庫(kù)作歷史查詢，實(shí)時(shí)數(shù)據(jù)則封裝成Json數(shù)據(jù)格式保存在內(nèi)存映射中，內(nèi)存映射中的數(shù)據(jù)供WebSocket服務(wù)端讀取。Web端在頁(yè)面加載完畢后初始化WebSocket接口并創(chuàng)建與服務(wù)器端WebSocket的連接，此時(shí)在Web端會(huì)綁定4個(gè)方法用于響應(yīng)4種不同的事件(onopen事件、onmessage事件、onerror事件和onclose事件)，而在服務(wù)端則會(huì)生成一個(gè)WebSocket對(duì)象并初始化一個(gè)用于監(jiān)聽(tīng)Web發(fā)送消息的方法。在建立連接之后，Web端就會(huì)觸發(fā)onopen事件，并向服務(wù)端發(fā)送一條消息，Websocket服務(wù)端監(jiān)聽(tīng)到消息之后從內(nèi)存映射中取出實(shí)時(shí)的Json數(shù)據(jù)，并向Web端發(fā)送消息，Web端在接收到消息之后觸發(fā)onmessage事件，從而更新頁(yè)面數(shù)據(jù)。

3 Websocket應(yīng)用的實(shí)現(xiàn)和測(cè)試

3.1 應(yīng)用實(shí)現(xiàn)

為了驗(yàn)證WebSokcet實(shí)現(xiàn)實(shí)時(shí)數(shù)據(jù)更新方法的可行性，系統(tǒng)服務(wù)端配置為：Pentium 4處理器、CPU 主頻 2.9 GHz、內(nèi)存3.38 GB、操作系統(tǒng)為Windows 7、JDK 7、Web服務(wù)器為T(mén)omcat 8。并以重慶郵電大學(xué)智能家居系統(tǒng)為基礎(chǔ)，采集能耗數(shù)據(jù)，Web界面家庭能耗數(shù)據(jù)如圖4所示。

圖4 智能家居能耗數(shù)據(jù)Web界面

打開(kāi)頁(yè)面之后，Web端通過(guò)var WebSocket =new WebSocket('ws:// 172.22.140.111:8080/WebSocket/websocketT')與服務(wù)端WebSocketServer建立連接。其中ws表示采用的WebSocket協(xié)議，172.22.140.111表示服務(wù)端IP地址，8080表示服務(wù)端對(duì)應(yīng)的端口，“WebSocket/websocketT”表示W(wǎng)ebSokcet的MAP。建立連接后，Web端和服務(wù)端就可以直接進(jìn)行通信。Web端接收到數(shù)據(jù)后觸發(fā)onMassege()方法，在此方法中通過(guò)var data = event.data 得到數(shù)據(jù)，由于得到的數(shù)據(jù)是String格式，所以還必須通過(guò)var JsonObject= eval("(" + data + ")") 將數(shù)據(jù)封裝為Json數(shù)據(jù)格式，最后就可以利用DOM模型得到相應(yīng)的數(shù)據(jù)并在相應(yīng)的位置顯示出來(lái)。

3.2 應(yīng)用測(cè)試驗(yàn)證

由于WebSocket是全雙工通信方式，其實(shí)時(shí)性大于Ajax輪詢，所以本文只對(duì)兩種方式帶寬占用的情況進(jìn)行測(cè)試驗(yàn)證。為了體現(xiàn)測(cè)試的公平性，兩種方法都搭建在同一個(gè)智能家居平臺(tái)上，采集相同的數(shù)據(jù)，且數(shù)據(jù)上傳的周期一定。測(cè)試工具為WebServer Stress Tool 7。測(cè)試結(jié)果如圖5如示，從圖中可以看出，WebScocket比Ajax輪詢明顯占用了更小的帶寬。

圖5 Ajax與WebSocket帶寬對(duì)比圖

4 結(jié)論

本文通過(guò)分析傳統(tǒng)Web應(yīng)用的前后臺(tái)數(shù)據(jù)交互中存在的缺點(diǎn)和局限，提出了智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)中應(yīng)用WebSocket技術(shù)的方案。并在基于JAVA語(yǔ)言編寫(xiě)的后臺(tái)程序下實(shí)現(xiàn)了WebSocket技術(shù)在服務(wù)端和Web端之間的全雙工通信，最后通過(guò)在同一平臺(tái)上的測(cè)試，驗(yàn)證了WebSocket擁有更高的實(shí)時(shí)性和更低的帶寬占用。為智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)數(shù)據(jù)更新的方法提出了一種新的嘗試。

[1] 韓安.HTML5 WebSocket技術(shù)研究[J]. 電子世界,2013(20):5-6.

[2] 趙鑫,朱一群. 基于Android智能手機(jī)的智能家居監(jiān)控系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J]. 硅谷,2013(16):29-31.

[3] 鹿海磊. 基于Web of Things技術(shù)的應(yīng)用關(guān)鍵技術(shù)及案例分析[D].北京：北京郵電大學(xué),2013.

[4] 閆石. 基于嵌入式B/S架構(gòu)的智能家居遠(yuǎn)程監(jiān)控系統(tǒng)開(kāi)發(fā)[D].南京：南京理工大學(xué),2014.

[5] 吳勝兵. 智能家居信息管理系統(tǒng)的研究[D].長(zhǎng)春：吉林大學(xué),2014.

[6] 吳曉東,王鵬. Html5的通信機(jī)制及效率的研究[J].長(zhǎng)春理工大學(xué)學(xué)報(bào)(自然科學(xué)版),2011,34(4):159-163.

[7] 丁磊. 基于WebSocket的消息推送系統(tǒng)設(shè)計(jì)與事件匹配技術(shù)研究[D].北京：北京郵電大學(xué),2014.

[8] 付蔚,劉謀黎,蔡林沁. 智能家居系統(tǒng)嵌入式家庭服務(wù)器設(shè)計(jì)與實(shí)現(xiàn)[J]. 自動(dòng)化與儀表,2013,28(4):37-40.

[9] 陳博,付蔚,薛震,等. 智能家居虛擬場(chǎng)景設(shè)計(jì)與實(shí)現(xiàn)[J]. 物聯(lián)網(wǎng)技術(shù),2014(3):66-69.

Research and application of WebSocket technique in smart home remote monitoring system

Liao Haibo，Du Liang，Zheng Fangxiong，Shen Xinyi，Jiang Yuan

(Key Laboratory of Network Control and Industrial Things of Ministry of Education,Chongqing University of Posts and Telecommunications, Chongqing 400065, China)

In order to improve the problem of data real-time interaction and the waste of bandwidth resources in web application of smart home furnishing, the paper uses WebSocket technology by comparing the performance of Ajax polling technology and WebSocket technology in B/S module to update the real-time data interaction in smart home web application. And the feasibility of this method is proved by the example of JAVA background technology.

smart home; WebSocket; polling; JAVA background

TP79

A

10.19358/j.issn.1674- 7720.2017.07.004

廖海波，杜亮，鄭方雄，等.WebSocket在智能家居遠(yuǎn)程監(jiān)測(cè)系統(tǒng)中的研究與應(yīng)用[J].微型機(jī)與應(yīng)用，2017,36(7)：12-14,18.

2016-12-05)

廖海波(1990-)，男，碩士研究生，主要研究方向：智能家居。

杜亮(1991-)，男，碩士研究生，主要研究方向：JAVA服務(wù)器開(kāi)發(fā)。

鄭方雄(1994-)，男，碩士研究生，主要研究方向：Web前端開(kāi)發(fā)。