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

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

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

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

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

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

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

智能家居；WebSocket; 輪詢；JAVA后臺

0 引言

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

1 WebSocket概述

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

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

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

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

2 WebSocket應用設計

2.1 系統(tǒng)結構

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

圖1 WebSocket與Polling延時對比圖

圖3 服務端與Web端交互流程圖

圖2 智能家居系統(tǒng)結構圖

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

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

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

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

3 Websocket應用的實現(xiàn)和測試

3.1 應用實現(xiàn)

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

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

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

3.2 應用測試驗證

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

圖5 Ajax與WebSocket帶寬對比圖

4 結論

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

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

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

[3] 鹿海磊. 基于Web of Things技術的應用關鍵技術及案例分析[D].北京：北京郵電大學,2013.

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

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

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

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

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

[9] 陳博,付蔚,薛震,等. 智能家居虛擬場景設計與實現(xiàn)[J]. 物聯(lián)網(wǎng)技術,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在智能家居遠程監(jiān)測系統(tǒng)中的研究與應用[J].微型機與應用，2017,36(7)：12-14,18.

2016-12-05)

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

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

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