基于Web发布的组态软件设计与实现

2018-03-30 01:29吴培浩王世勇
自动化与仪表 2018年1期
关键词:配置文件组态浏览器

张 成,李 迪,吴培浩,王世勇

(华南理工大学 机械与汽车工程学院,广州 510640)

随着全球经济的发展和科学技术的进步,大规模、集成化、智能化生产已是工业发展的必然趋势。组态软件运用于生产系统的监控管理层,对于统筹全局,调整生产,提高效率发挥着巨大的作用。然而,目前大多数组态软件属于嵌入式组态软件,完成组态的监控界面在运行时,必须依托于软件开发商的运行软件或运行设备,从而导致监控工作的效率较低且实现复杂。对此,提出了一种基于Web发布的组态软件设计与实现。监控界面在编辑完成后生成配置文件,并通过Web发布,用户只需使用浏览器就可以运行监控界面;监控界面在浏览器端通过与Web服务器的数据交互,实时刷新界面,实现监控。

1 软件功能分析

基于一般组态软件的功能和Web发布的特点分析,此组态软件应满足以下需求:

(1)用界面元素构建监控界面。界面元素包括基本图元和功能控件。添加界面元素后,能够编辑其属性和布局。

(2)监控界面的动态变化靠实时数据驱动。在界面编辑时,软件能够获取数据源数据的信息,建立内外数据的联系。

(3)组态软件的Web发布是指将组态生成的监控界面以及相关配置信息以 Web页面的形式发布,用户通过 Internet和浏览器对现场实时监测[1]。发布前,需将组态结果生成适合用于Web发布的配置文件,并以Web服务器为中心构建发布环境,实现监控界面的工作。

2 结构设计

根据软件的功能分析,基于Web发布的组态软件的设计分为组态环境和发布环境两部分,如图1所示。组态环境由组态编辑软件和通信接口组成,其主要功能是编辑监控界面,建立组态数据对象并确立其与界面元素和外界数据源数据的对应关系,最终生成配置文件。Web发布环境则是由浏览器、Web服务器、数据区和通讯接口组成,它的功能是解析配置文件并配置发布环境中的各组成部分,使得用户可以用浏览器实现监控。在此,着重分析组态环境、配置文件及发布环境。

图1 软件框架Fig.1 Software framework

2.1 组态环境

组态环境的主体是组态编辑软件,由界面组态模块、数据组态模块、通信配置模块3个功能模块组成。

2.1.1 界面组态模块

界面模块的主要功能是编辑监控界面,获取“所见即所得”的组态效果。用户添加界面元素,并设置其属性和布局。此外,界面元素的部分属性可以与数据组态模块中的数据对象进行关联,并设置界面元素如何依据数据进行变化。

2.1.2 数据组态模块

数据组态模块主要进行自定义组态数据对象的创建和管理。数据对象是数据值、数据类型、最值、报警值等数据相关信息的综合体。数据对象是信息交互媒介。如图2所示,对于软件内部,数据对象关联界面元素,“驱动”界面的变化,同时联系各界面元素;对于外部,数据对象通过通信接口与数据源数据接触,实现内外数据的对应。

图2 数据关联模式Fig.2 Data association model

2.1.3 通信配置模块

监控界面运行的“源动力”是数据源的数据,而通信配置模块功能就是定义数据源数据与组态软件内部数据对象的对应关系。

数据源是指目标设备或者是第三方软件。通信配置模块通过通信接口访问数据源,获取可监控数据的信息并呈现给用户。这些可监控数据一般被称为通道数据,用户根据监控需求,将通道数据与数据组态模块中组态数据对象关联起来,完成内外数据的对接。

2.2 配置文件

组态编辑软件各模块在组态后生成相应的配置文件。

界面组态模块生成界面配置文件,包括HTML页面文件、CSS(层叠样式表cascading style sheets)样式文件和JavaScript脚本文件等3种。其中,HTML页面文件描述界面中包含的界面元素;CSS样式文件描述元素的属性和布局;JavaScript脚本文件实现元素的动态效果。

数据组态模块和通信配置模块生成XML形式的数据配置文件和通信配置文件。XML是一种可扩展标记语言,可以根据需求自定义XML标签,具有跨平台、跨语言的特点,兼容性强,适合用于保存配置信息。

2.3 发布环境

2.3.1 浏览器

浏览器是监控界面运行的载体。利用浏览器呈现监控界面的优势有:①浏览器是各种操作系统默认安装的工具软件,用户不必为监控工作安装其他软件。②浏览器基于互联网使用,为远程监控和局域网内多点监控的实现带来便利。

2.3.2 Web服务器

Web服务器为浏览器中的监控界面与数据区之间的数据交互提供接口(PHP)。如图3所示,该数据交互过程基于AJAX技术实现,AJAX(异步的JavaScript和XML)并不是一种新的语言或技术,包括了 XML HttpRequest,JavaScript和 DOM 等多项技术[3]。使用AJAX技术,浏览器可在不用重载整个页面的情况下,与服务器进行数据交互并更新部分页面,极大地提高监控界面的运行效率。

图3 监控界面运行时的数据交互Fig.3 Data interaction during monitoring interface runtime

2.3.3 数据区

数据区主要由实时数据缓冲区和历史数据库构成。实时数据缓冲区是根据配置文件动态生成的数据缓存区域,该区域为每个数据对象分配一定空间用于存储当前值。所有数据的交互都是以缓冲区为中介。历史数据库的作用是长期存储数据。

2.3.4 通信接口

发布环境中的通信接口与组态环境中的不同。在获取数据信息后,需根据配置文件中内外数据的关联方式,将数据信息写入实时数据缓冲区的对应内部数据中。通信接口与数据源的数据交互,根据不同目标对象选用不同的通信标准,与设备进行通信常采用OPC标准,而与第三方软件通信常采用DDE(动态数据交换)或 socket[4]。

3 关键技术与实现

3.1 界面元素设计

界面元素是监控界面效果展示的核心部分。在组态环境中,界面元素基于MFC类库实现。在发布环境中,监控界面运行于浏览器,界面元素基于HTML实现。2种环境下的界面元素通过界面配置文件对应,设计界面元素时,为保证界面元素的一致性,需要在以下2种环境下进行协调。

3.1.1 组态环境下的实现

组态环境下,界面元素设计都可以分为创建和编辑两个方面。在创建方面基于工厂模式进行设计。如图4所示,界面元素相当于“产品”,从界面元素基类 CGraphObj派生 CMyRect,CMyEdit等界面元素子类。与“产品”对应的是“工厂”,自定义“工厂”基类CGraphTool,并派生出各界面元素的“工厂”类(CRectTool,CEditTool)[2]。 利用“工厂”类创建界面元素,可实现界面元素属性与其创建方法分离,为其创建和扩展提供便利。主程序只通过“工厂”类提供的创建接口间接创建界面元素,因此界面元素类扩展后不会影响主程序,因为创建接口不变。

图4 基于工厂模式的界面元素设计Fig.4 Design of interface elements based on factory model

界面元素的编辑操作与创建具有相似性(响应鼠标操作),因此利用CGraphTool派生CSelectTool类,用于界面元素的编辑操作(选中、拖拽、缩放等)。这样可将创建和编辑操作分离,减小程序各模块的耦合。

3.1.2 发布环境下的实现

在发布环境下,界面元素的设计基于HTML,CSS和JavaScript进行。采用HTML的

标签表示界面元素,如:

界面元素的动态效果通过插入的JavaScript脚本实现。采用面向对象的思想,将界面元素所有效果和功能的实现脚本进行封装。在实现方面,基本图元和功能控件有所不同,具体如下:

——基本图元可利用HTML的标签实现。它除了具有普通标签属性外,还能在其区域中进行各种绘图操作。封装基本图元对象时,向基本图元的

标签中插入子标签,并编写脚本进行更新绘制,实现基本图元的各种效果。

——功能控件对象比较复杂,可通过封装现有功能控件来减小开发难度。常见功能控件(如编辑框、按钮等)直接利用HTML内置的