陈　炜　苏厚勤　柴　炯

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)，通过