基于WebSocket技術水文資源監管系統的研究與實現

陳　煒　蘇厚勤　柴　炯

1(東華大學計算機科學與技術學院　上海 200051)2(上海華虹計通智能系統股份有限公司　上海 200051)

?

基于WebSocket技術水文資源監管系統的研究與實現

陳煒1蘇厚勤1柴炯2

1(東華大學計算機科學與技術學院上海 200051)2(上海華虹計通智能系統股份有限公司上海 200051)

水污染已成為當前急需解決的難題，傳統方法和手段已不能滿足監管應用的需求。結合設計和實現一個水文監管系統的實際項目，闡述系統的基本構架和實現方式。利用JavaEE7和WebSocket協議實現了全雙工通信，很好地滿足了水文信息實時監測、管理、分析和查詢需求。實際應用表明，該系統不僅能減少網絡通信阻塞和計算資源浪費，同時也提升了分布式系統數據實時交互和訪問的性能。

WebSocket協議全雙工通信水文監管Web地理信息系統

2(Shanghai Huahong Jitong Smart System Co.,Ltd.,Shanghai 200051,China)

0　引　言

水利資源是國民經濟和社會人文發展的命脈。隨著國民經濟發展和居住相對聚集，水污染問題已日益突出，在一定程度上已嚴重制約我國的經濟和社會發展。如何監管和治理水資源污染現象，已成為改革開放以來各屆政府高度關注的重大民生實事。利用計算機信息化和物聯網技術改變水資源傳統的監管方法及手段，由傳統水資源監管向現代水資源監管方法轉變，由工程水利向資源水利、可持續發展水利監管方向轉變是必然趨勢。

本文研究、設計、實現和描述了一種基于WebSocket通信技術的水資源監管系統。應用水文傳感器、微網、無線通信、GIS、百度地圖和物聯網相關技術予以集成規劃和設計，采用JavaScriptAPI和Java語言等編程實現。該系統支持PC和移動設備應用，在共享最新水質信息基礎上，提供了功能豐富、交互性強的Web地圖應用，支持HTML5Web頁面特性，滿足水利資源實時監視GIS信息展現的管理要求，為專業人士和監管部門提供信息查詢和分析，為預防和治理水污染提供指導依據。

本文研究和實現的系統對構建一個水文檢測信息管理平臺具有一定借鑒性。

1　實時通信交互方案的分析比較

1.1Comet技術構架交互方案的局限性

當前，大多數網站的實時交互方案采用Comet技術。Comet是一種Web應用程序的基礎構架。基于這種構架，客戶端不需要顯式地向服務器發送請求，服務器就能在數據發送變化時，主動以異步方式將變更后的數據推送至客戶端，使客戶端能實時反應后端數據的變化。Comet技術不同于傳統的Ajax(AsynchronousJavaScriptandXML)技術，因為Ajax默認是無狀態的，需要客戶端向服務器發送一個異步請求獲得反饋。Comet技術是一種反向Ajax技術，或稱為服務器端推送技術。

Comet技術構架的通信傳輸實現模式分為兩類，即長輪詢模式和流模式。

長輪詢模式有別于定時輪詢模式。定時輪詢模式通常要求客戶端每隔一段時間就向服務器發送一個請求，為了達到實時性，間隔時間就要盡可能的小。這就有可能產生資源和帶寬的浪費，因為不一定每次請求都會返回有用的數據。長輪詢模式是對定時輪詢的改進，方法是打開一個連接服務器的請求，并保持一段時間，直到服務器端數據有更新數據返回或是連接超時[1]。長輪詢模式減少了冗余的數據請求和網絡負載壓力，但是如果服務器端數據頻繁更新時，它與定時輪詢模式并沒有本質區別，性能也沒有什么優勢。

流模式是客戶端打開一個與服務器的持久連接，服務器通過此連接向客戶端發送數據。基于流模式的連接會一直保持開啟，直至過期。流模式和長輪詢模式相比，可以減少對服務器的頻繁請求，避免了連接服務器的延時，但增加了帶寬占有量、易造成網絡通信阻塞。長輪詢模式和流模式的處理流程分別如圖1和圖2所示。

圖1　長輪詢模式流程示意圖

圖2　流模式處理流程示意圖

長輪詢和流模式兩種通信傳輸模式都不是真正意義上的實時通信技術，是通過Ajax技術模擬的一種實時效果。客戶端與服務器端的交互還是通過請求和應答的方式交互，請求需要在服務器上存在一段時間，如果沒有數據返回，線程就一直處于空閑的狀態。為了實現實時反饋變更數據的通信效果，需要在半雙工的HTTP上模擬全雙工通信，一般需建立兩個連接分別用于處理客戶端與服務器端之間的雙向通信。這種模擬方法不僅增加了編程的復雜性，也增加了系統和網絡的資源消耗。

1.2應用WebSocket實現雙向通信的技術優勢

作為下一代Web標準的HTML5提供了許多新的特性，WebSocket就是其中一個非常引人注目的特性，被稱為“WebTCP”。其本質就是基于TCP為客戶端與服務器端提供了一種Socket通信連接，使得客戶端與服務器端可以實現雙向通信。

要建立一個WebSocket連接，客戶端需要向服務器發送一個HTTP請求，申請協議升級為WebSocket協議，服務器根據HTTPHeader識別請求類型，若為WebSocket請求，則升級為WebSocket連接，至此雙方就可以進行全雙工通信了[2]。WebSocket協議通信模式中的握手過程如圖3所示。

圖3　WebSocket協議通信模式中握手過程示意圖

WebSocket與Comet技術構架相比擁有更強的通信能力，真正實現了實時數據通信。一旦WebSocket連接建立，服務器和客戶端就可以實現數據的雙向流動，增強了服務器的推送能力。與HTTP協議相比，它的頭信息更為簡潔，大大減少了冗余數據的傳輸。在用戶規模大，實時性能要求高的環境，對于降低網絡負載方面比傳統實時通信傳輸方式具有更大的優勢。

2　關鍵技術研究與實現

建立一個基于WebSocket技術構架的連接，需要在客戶端和服務器端同時實現，在客戶端使用基于JavaScript的WebSocketAPI。首先使用WebSocket全球資源定位符協議URLP(universalresourcelocaterprotocol)接口創建一個WebSocket對象，URL參數指向需連接的服務器端的IP地址，以“ws://”或“wss://”為前綴，分別代表WebSocket和安全的WebSocket連接[3]，protocol參數為雙方的連接所使用WebSocket的子協議名稱。核心代碼如下：

varwebSocket=null;

if(′WebSocket′inwindow) {

webSocket=newWebSocket(′ws://′ +window.location.host+ ′/sw/Chart/sensorWebSocket′);

}elseif(′MozWebSocket′inwindow) {

webSocket=newMozWebSocket('ws://' +window.location.host+ '/sw/Chart/sensorWebSocket');

}else{

alert(″不支持″);

}

申請WebSocket對象時，需要考慮瀏覽器是否支持WebSocket。當客戶端和服務器連接成功后，會觸發onopen消息，此時客戶端就可以通過send接口向服務器發送數據；如果連接失敗，發送、接收數據失敗或者處理數據出現錯誤，客戶端會觸發onerror消息；當客戶端收到服務器端發送的數據時，就會觸發onmessage消息，參數event中包含服務器端傳輸過來的數據；當客戶端接收到WebSocket服務器端發送的關閉連接請求時，就會觸發onclose消息。四個觸發事件和觸發條件關系如表1所示。

表1　觸發事件與條件關系表

客戶端WebSocket連接的核心代碼如下所示：

webSocket.onerror=function(event) {

onError(event)

};

webSocket.onopen=function(event) {

onOpen(event)

};

webSocket.onmessage=function(event) {

onMessage(event)

};

webSocket.onclose=function(event) {

onClose(event)

};

相比客戶端，創建WebSocket服務器端應用有多種方案可供選擇，如JBoss(Java)、pywebsocket(Python)、Node.js(JavaScript)和tomcat7等[4]。JavaEE7為滿足HTML5 的開發需求新增和修改了一系列API，使得創建一個WebSocket應用變得相對簡單，只需通過注釋方式就可實現與客戶端觸發事件相對應的四個方法的完成。根據水文監測數據的類型特點，本文設計客戶端和服務器端的交互數據的格式采用Java腳本對象符號JSON(JavaScriptObjectNotation)格式，便于雙方解析數據。一個用于建立連接，解析客戶端JSON格式請求數據，根據請求獲取數據庫數據、封裝成JSON格式消息并反饋和關閉本次通信連接的公共類的WebSocket核心代碼段概列如下：

publicclassWebSocket{

@OnMessage

publicvoidonMessage(Stringmessage,Sessionsession)

throwsIOException,InterruptedException{

params=analyzeJSONObject(message)

//解析客戶端發來的JSON類型的數據

data=getData(params);

//從數據庫獲取數據

session.getBasicRemote().sendText(data);

//向客戶端返回數據

}

@OnOpen

publicvoidonOpen() {

System.out.println(″建立連接″);

}

@OnClose

publicvoidonClose() {

System.out.println(″關閉連接″);

}

@OnError

publicvoidonError(Sessionsession,Throwablet) {

t.printStackTrace();

}

}

至此，WebSocket客戶端和服務器端都已實現。為了建立一個WebSocket連接，首先由客戶端瀏覽器發送一個HTTP請求。該請求和通常的HTTP請求相似，但是包含了一些附加頭信息，其中附加頭信息“Upgrade:WebSocket”表示客戶端申請將通訊協議從HTTP協議轉換到WebSocket協議。請求字段中Sec-WebSocket-Key的值為客戶端隨機生產，是一個基于base64編碼的16字節序列。服務器端在解析信息后，需要返回一個Sec-WebSocket-Accept字段，并將HTTP狀態碼設置為101，表明將協議轉換到WebSocket協議。客戶端驗證Sec-WebSocket-Accept字段的信息符合要求，則握手成功建立連接。

在建立連接后，由于網絡問題或其他原因，可能會造成連接中斷，所以需要在通信過程中檢查連接狀態，判斷是否需要重新連接。其核心代碼如下：

if(webSocket.readyState!=WebSocket.OPEN)

reconnectingWebSocket();

為了實現數據的實時顯示，關鍵是要解決當有新數據上傳到服務器時，服務器能夠主動把最新數據信息推送到客戶端，服務器端實時檢測數據更新并即時發布是其中的重要一環[5]。因此，為了使WebSocket能獲取最新數據而又不增加數據庫的負擔，本文設計的系統在儲存最新數據時，設置了一個全局變量IsUpdated用來判斷是否有采集到的最新數據。在WebSocket應用的onMessage方法中不斷監測IsUpdated的值，如果其值發生變化，即查詢數據庫并將數據封裝成JSON格式的消息文件推送至客戶端，其即時推送的具體處理流程如圖4所示。

圖4　實時數據推送流程圖

客戶端和服務器端通過進程創建基于WebSocket技術的通信連接應用功能后，系統就能利用服務器的推送功能實現對水文監測數據的實時監視和管控。

3　系統設計

3.1系統總體架構設計

水文監管系統通過對各種水文傳感器數據的實時采樣，由微網組成的分布式網絡傳輸數據，結合遠程通信協議GPRS將數據匯集到管理中心。在系統的管理中心數據經處理修正后，能在GIS地理信息平臺上顯示水文監測點的實際狀況，能在大量水文監測數據中進行數據挖掘與分析，實現水文監測信息實時監視和即時管控，有效解決動態即時管理方面的技術難題。該系統基于百度地圖API、HighstockAPI、Java語言、Oracle數據庫和WebSocket協議等相關技術，采用B/S構架模式，構建了一個實時水文監測管理系統[6]。根據水文監測數據的特點和系統的應用場景，整個系統采用分布式構架[7]組成，具體如圖5所示。

圖5　系統總體架構視圖

水文監管系統主要由系統信息采集、數據存儲管理、數據挖掘分析和系統展示功能組成。

1) 系統信息采集主要通過層次通信網絡模式將各個傳感器數據采集并匯集到信息采集平臺中。

2) 數據的存儲管理主要通過關系式數據庫管理系統實現。

3) 數據挖掘分析主要通過相同特征數據的粒度聚合和數據倉庫技術，建立適合數據挖據分析的維度和事實表，以支持多種統計分析應用。

4) 系統展示主要采用B/S方式，Web服務器、應用服務器、匯集服務器、終端PC機及移動終端等設備，對水文信息情況進行展示和監測。

根據系統總體構架設計，對應的系統軟件結構如圖6所示。其中：

圖6　系統軟件結構視圖

1) 表示層的載體為瀏覽器，目前主流的瀏覽器都已經支持WebSocket，包括IE10+、Chrome4+、Firefox4+、Opera11+等。客戶端根據不同的需求，發送相應的請求，通過后臺處理模塊從服務器數據庫中獲取相關數據，然后在百度地圖上顯示或用Highstock對數據進行分析。

2) 業務邏輯層主要負責三部分計算。① 對匯集服務器上傳的實時數據進行修正并存儲；② 處理客戶端的請求并返回相應數據；③ 支持數據倉庫ETL(ExtractTransformLoading)處理和多種統計分析應用。

3) 數據層由支持系統應用的數據庫和數據倉庫組成，包括水文監測實時數據、水文歷史數據、基站注冊數據、節點注冊數據、網絡配置數據和水文統計數據等存儲、訪問和管理。

3.2系統模塊設計與實現

系統主要由水文數據的采集處理、水文信息監控、水文信息分析、設備網絡管理和系統管理等模塊和子系統組成。主要功能模塊如圖7所示。

圖7　系統功能模塊示意圖

(1) 數據采集處理模塊

該模塊負責對匯集服務器上傳的水文實時數據，匯集服務器上傳的數據位原始數據，需要對一些數據進行處理和一系列的轉換。對于一些錯誤數據需要修正，然后存儲在數據庫中。為了能使系統正確地接收數據，需要對采集設備發送控制命令，以便管理和保證設備的正常工作。系統數據采集上傳和命令的下發的具體過程如圖8所示。

圖8　數據采集處理過程

(2) 信息監控模塊

信息監控模塊有三個子功能，分別為分布實時監測、區域實時監測和區域變化監測。這個模塊都是基于百度地圖的JavaScriptAPI開發的。百度地圖JavaScriptAPI是一套由JavaScript語言編寫構建地圖的應用程序接口，利用它能夠在網站中構建功能豐富、交互性強的地圖應用，并且支持HTML5特性，可以很方便地構造實時GIS應用。

在開發前需要申請一個密鑰(key)，通過