基于Web發布的組態軟件設計與實現

張 成，李 迪，吳培浩，王世勇

（華南理工大學 機械與汽車工程學院，廣州 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的