基于Comet技术的机械设备故障预警图形系统研究与实现

汪祖民，王原习，孙继武

（1. 大连大学 信息工程学院，辽宁 大连 116622；2. 长春工程学院 机电工程学院，吉林 长春 130012）

基于Comet技术的机械设备故障预警图形系统研究与实现

汪祖民1，王原习1，孙继武2

（1. 大连大学 信息工程学院，辽宁 大连 116622；2. 长春工程学院 机电工程学院，吉林 长春 130012）

为提高火电厂输煤设备检修的效率，解决相应软件系统的实时性和便利性问题，提出了以Comet技术为核心的基于Web的设备故障预警图形系统。系统采用Raphaël来绘制矢量图形，结合基于DOM的脚本编程技术实现了图形系统与用户的友好交互；采用Ajax长轮询方式模拟实现数据信息的服务器端推送，Ajax引擎的异步通讯机制有效解决了页面动态更新问题。在提高信息实时性、降低服务器压力的同时，系统带来了良好的用户体验。

设备检修；故障预警；图形系统；服务器推送；Comet

0 引 言

图形系统因其直观性、友好性，被公认为人机交互的主流方式。在过去电力应用系统的图形支持系统中，有基于C/S模式的图形化客户端应用，也有采用ActiveX和Applet来实现基于Web的图形支持的应用[1]。但大多系统存在着可移植性差、信息共享和数据交互困难等问题。随着Web技术的发展，SVG等矢量图形技术开始应用于电力图形系统中，并对电力系统网络化图形化产生了积极作用[1]。

文献[2]在研究SVG图形绘制的基础上，初步介绍了基于 Ajax技术的电力图形系统的实现方案。Ajax技术的引入，改善了基于B/S模式的应用程序数据更新交互困难的现状，通过向服务器发送异步请求，并在请求返回时，用JavaScript来控制更新UI，使Web应用程序看起来是即时响应的。文献[3]应用Ajax轮询实现了基于SVG的电厂运行监视系统，文献[4]针对SVG实时数据动态刷新问题，提出了基于Ajax引擎的解决方案。但是Ajax轮询机制，受限于Ajax请求间隔和信息实时性之间的矛盾，系统仍会给用户带来消息延迟的感觉，并且无效的Ajax请求会消耗大量网络带宽和服务器资源[5]，降低系统性能。本文采用了基于 Comet的服务器推送技术，通过建立 HTTP长连接的方式在一定程度上解决了请求间隔和实时性之间的矛盾，避免无效Ajax请求，节约网络带宽，提升系统性能，带来更好的用户体验。

火电厂输煤系统与其他设备运行监控系统不同。后者多采用在线实时监控，而前者因设备运行环境复杂恶劣，考虑到经济效益问题，不适宜对设备进行在线实时监控，多采用以状态检修为基础的点检定修制。在输煤设备检修实际应用中，点检人员需要在输煤线路运行期间对设备进行巡检，通过手持巡检仪器对设备进行检测，并在巡检结束后将数据导入计算机，在本机或内部网络上完成数据分析预警以指导检修工作。

根据以上叙述，我们看到当前的输煤设备检修软件辅助系统获取信息慢，数据共享难，影响设备故障的有效诊断和及时排除。针对当前的输煤设备检修策略，我们借鉴电网设备在线监控系统的模式[6]，采用矢量图形作为图形系统的显示格式，应用服务器推送技术，设计了基于Web的机械设备故障预警图形系统，能够及时获取点检仪采集的数据，并将数据信息迅速清晰地呈现给终端用户。

1 系统架构设计与关键技术

图1描述了机械设备故障预警图形系统的架构。巡检仪将设备检测数据通过无线网络上传至Web服务器，服务器对这些数据进行逻辑事务处理，将数据及处理结果保存至数据库中，同时将检测数据异常的设备信息及时通知给客户端浏览器，然后客户端通过JS脚本将服务器反馈回的信息呈现在页面中。此时，系统用户就可以通过系统的图形界面清晰直观的查看到具体的异常信息。此外图形系统可以关联设备管理、运行管理、图表分析等模块，更好地完成设备的日常管理及维护检修工作。该系统的应用可以很好地监测当前的设备状态，提高设备检修的针对性，降低设备故障发生率。

图1 系统架构图

机械设备故障预警图形系统的核心包括两部分：第一是设备矢量图形的建立，第二是客户端与服务器端之间的数据通信及页面信息更新。

1.1 矢量图形技术

当前的Web应用系统中，传统的位图早已不能满足网络用户对分辨率、交互性等方面的需求。而矢量图形由于其文件小、易编辑、可伸缩等优点，在Web系统中得到广泛应用。Web程序开发中，矢量绘图的解决方案主要包括SVG、VML等技术。

VML与 SVG都是基于下一代网络标记语言XML的矢量图形语言。VML由Microsoft等公司提出，但仅在 IE系列浏览器支持良好。SVG则是由W3C推出的互联网矢量图形的一个开放标准，但SVG从IE9开始才被IE系列浏览器内在支持。考虑到与主流浏览器的兼容性，系统采用Raphaël来绘制设备矢量图形。Raphaël是一个轻量级的绘制矢量图形的JS类库[7]，在IE9、Firefox、Chrome等浏览器中使用SVG绘制图形，在IE6/7/8浏览器中则使用VML来绘制图形。

Raphaël提供了circle、rect、ellipse等函数直接来绘制圆、矩形、椭圆等标准图形。对于较复杂的图形，Raphaël提供了path方法。其函数及参数格式如下：

Paper.path([pathString]) //pathString为SVG格式的路径字符串

除可以绘制路径图形外，Raphaël还提供了丰富的动画特效，可实现图层设定，集合创建，给元素添加事件等功能。同时还可利用Raphaël来绘制图表。

1.2 服务器推送与Comet技术

服务器推送的基础思想是将客户端主动查询信息改为服务器主动发送信息。该设计模式中，服务器是中心实体，将首先获得关于所发生的任何更改的通知，并负责将此类更改告知所有连接的客户端。但遗憾的是，Web通讯中的HTTP协议某种意义上来说是一种单向的协议，即HTTP场景中的所有通信必须由客户端发起，至服务器结束。所以我们必须采用其它方法来绕过这些问题，主要解决方案有Ajax轮询、基于插件（ActiveX、Applet、Flex）的推送技术和Comet[8]。

Comet有时也称为反向Ajax，是一种基于HTTP长连接的服务器推送的实现技术。Comet的实现方式可以分为两类：流方式（streaming）和长轮询方式（long-polling）。

本文采用长轮询方式实现Comet，其原理如图2所示：客户端向服务器端请求建立连接，服务器阻塞连接（通过使请求线程在某些条件下处于等待状态），当有事件发生时，服务器通过该连接发送数据，随后关闭连接；客户端在接收更新后，立即重新建立一个的长轮询连接[9]。基于长轮询的Comet保证了正在通讯的客户端与服务器端之间始终存在一个等待响应的HTTP长连接，使得Web服务器可以在无需显式请求的情况下主动向客户端发送数据。

图2 基于长轮询的Comet示意图

2 设备故障预警图形系统的实现

2.1 使用Raphaël绘制设备矢量图

要在Web应用程序利用Raphaël库来绘图，需在页面head标签内包含Raphaël.js文件，该文件可以从Raphaël.com网站免费下载。包含js文件的格式如下：

接下来，就可以利用 js脚本进行绘图。脚本代码可以直接写在页面的script标签内，也可以写到单独的js文件中，再在页面上包含该js文件。

使用Raphaël库绘制矢量图，首先需要创建一个Raphaël画布对象，然后方可在画布上调用 Raphaël函数绘制图形。

//在html的canvas标签区域创建一个宽为1250、高为800的画布

因为设备图形大多较复杂，所以这里采用Raphaël的path方法。为保证代码的简洁性和可重用性，我们为每一种设备定义一个函数，参数 x1、y1为绘图的起点坐标。一个简单的设备示意图代码如下：

有了上面的设备图形绘制函数，就可以通过调用该函数在定义的画布Paper上绘图，并为图形添加样式和事件。代码如下：

//设定鼠标经过时的动画效果

2.2 基于Comet技术的故障预警实现

在本系统中，因为服务器掌握着系统的数据资源，往往其最先通过无线网络获取到手持巡检仪的设备检测数据。当数据更新后，服务器需要主动将相关更新信息发送给客户端。这与传统Web应用程序的“请求/响应”模式不同，需要实现“服务器推送”。

这里我们采用Dojo的Cometd包来实现基于长轮询的Comet。Dojo已经对Cometd做了封装，我们不用浪费大量的代码在搭建Cometd框架上。对于前端js脚本代码，我们只需要加上一个Cometd包的简单接口代码，便可以专注于自己的业务逻辑代码了。

浏览器根据接收数据进行页面更新的核心代码如下：

//接受服务器端的信息，显示到界面

equ_graph .attr(style); //为设备图设定相应样式//绘制闪动报警点

Dojo的Cometd包的后端实现是基于Java和Jetty组件的。配置过 web.xml文件后，我们创建一个DataUpdate类来处理业务逻辑。首先需要监听服务器接收手持巡检仪数据上传这一事件，当事件发生时，我们使用Dojo的广播方式将上传的更新数据发送给连接着的客户端。广播发送数据的代码如下：

//对"/alarm"频道广播消息

运用 Comet技术，客户端能够及时获取最新的设备检测数据及其状态信息。对于检测数据异常的设备，可利用JS脚本操作DOM文档将页面中相应设备图形样式重设为黄色虚线（预警样式），如图3所示。如需查看该设备的具体报警部位和点检数据，则可以单击设备图形跳转至该设备的三视图，在该视图下报警部位会闪动以提示用户，如图4所示。

图3 设备故障预警主界面

图4 设备部位图

3 结语

状态检修是机械设备检修发展的必然趋势。在当前的电厂中，基于SVG的电网实时监控系统应用普遍，但在机械设备检修方面却缺乏与点检制度相应的软件系统。本文实现的基于 Comet技术的机械设备故障预警图形系统，可以很好的应用于火电厂输煤系统设备检修体系中，提高设备检修效率。该系统具有以下特点：

（1）UI设计采用矢量图形作为显示格式，丰富直观，具有良好的交互性，用户操作方便简捷。

（2）采用 Comet方式模拟实现服务器端推送，可有效降低带宽负荷，提高系统性能，保证数据更新的实时性，从而提高设备检修效率。

（3）具有良好的扩展性，可以在此基础上方便地添加设备管理、运行线路管理、数据分析等模块，进一步掌控设备的健康状况及运行趋势。

Web技术发展迅速，随着HTML5标准的推广，Canvas、WebSocket、多媒体编程接口等新特性将大大丰富 web应用程序，使矢量图形和服务器推送等技术的实现变得更加安全简便。在此基础上建立的设备故障预警系统必将更加人性化、智能化，为设备的安全运行发挥更大作用。

参考文献：

[1] 石东源, 卢炎生, 王星华, 等. SVG及其在电力系统软件图形化中的应用初探[J]. 继电器, 2004, 32(16): 37-40.

[2] 敖丽敏, 李林辉. 基于 AJAX的电力图形系统的实现[J].电力系统自动化, 2007, 31(9): 47-50, 81.

[3] 胡冰, 章坚民, 马国梁, 等. 基于SVG/AJAX/Internet的电厂运行监控系统[J]. 机电工程, 2011, 28(8): 905-909.

[4] 郭挺, 谢敏, 刘明波, 等. SVG和Ajax技术在电网分析与辅助决策支持系统中的应用[J]. 电力系统保护与控制, 2012, 40(4): 83-89.

[5] Sandeep Malik. Implement a real-time server push in Ajax applications using socket-based RIA technologies [EB/OL]. [2009-9-22]. http://www.ibm.com/developerworks/cn/web/wa -aj-socket/.

[6] 耿方, 朱晓民, 李炜. 基于Web的实时监控系统的研究与实现[J]. 电信工程技术与标准化, 2011(11): 75-79.

[7] Raphaël. Raphaël-JavaScript Library [EB/OL]. [2013-1-10]. http://raphaeljs.com/.

[8] 孙清国, 朱玮, 刘华军, 等. Web应用中的服务器推送技术研究综述[J]. 计算机系统应用, 2008(11): 116-120.

[9] Mathieu Carbou. Reverse Ajax Part 1: Introduction to Comet [EB/OL]. [2011-7-19]. http://www.ibm.com/developerworks /web/library/wa-reverseajax1.

Research and Realization of the Fault Alarm Graphic System for Mechanical Equipment based on Comet

WANG Zu-min1, WANG Yuan-xi1, SUN Ji-wu2
(1. Information and Engineering College of Dalian University, Dalian 116622, China; 2. Electromechanical Engineering Institute, Changchun Institute of Technology, Changchun 130012, China)

In order to improve the efficiency of mechanical equipment maintenance in the fuel delivery department of thermal power plant, and solve the problems of real-time and convenience in the corresponding software, this paper puts forward a fault alarm graphic system for mechanical equipment based on Comet. In this system, Raphaël was used to portray vector graphic. Combined with the script programming of document object model (DOM), friendly interoperability of the graphics system was realized. The server-push of data-information was implemented by Ajax long-polling, and the asynchronous communication mechanism of Ajax solved the problem of real-time dynamic refreshment effectively. To improve the real-time information, and reduce the server pressure, the system brings a better user experience.

equipment maintenance; fault alarm; graphic system; sever-push; Comet

TP393.0

：A

：1008-2395(2013)06-0018-05

2013-10-15

吉林省教育厅“十一五”科学技术研究项目(2010195)。

汪祖民（1975－），男，博士，副教授，研究方向：物联网应用技术。