基于.NET和AJAX的凈水處理監(jiān)控系統(tǒng)開發(fā)

王斌，賀興，趙海

（1.中國人民解放軍91413部隊(duì)，秦皇島 066001；2.東北大學(xué)秦皇島分校計(jì)算機(jī)與通信工程學(xué)院，秦皇島 066004；3.中國人民解放軍65631部隊(duì)60分隊(duì)，錦州 121300；4.中國人民解放軍65037部隊(duì)，葫蘆島 125001; 5.東北大學(xué)信息科學(xué)與工程學(xué)院，沈陽 110819)

基于.NET和AJAX的凈水處理監(jiān)控系統(tǒng)開發(fā)

王斌1，2，賀興3，趙海4,5

（1.中國人民解放軍91413部隊(duì)，秦皇島 066001；2.東北大學(xué)秦皇島分校計(jì)算機(jī)與通信工程學(xué)院，秦皇島 066004；3.中國人民解放軍65631部隊(duì)60分隊(duì)，錦州 121300；4.中國人民解放軍65037部隊(duì)，葫蘆島 125001; 5.東北大學(xué)信息科學(xué)與工程學(xué)院，沈陽 110819)

介紹一套基于B/S架構(gòu)的凈水處理監(jiān)控系統(tǒng)的開發(fā)過程。該系統(tǒng)采用Microsoft.NET Framework 4.0框架，使用主流的C#語言進(jìn)行編碼，應(yīng)用ASP.NETAJAX架構(gòu)，使得頁面可以無刷新定時(shí)更新數(shù)據(jù)，實(shí)現(xiàn)對(duì)凈水監(jiān)控系統(tǒng)狀態(tài)的實(shí)時(shí)顯示功能，用戶體驗(yàn)良好。通過ADO.NET技術(shù)訪問數(shù)據(jù)庫，實(shí)現(xiàn)對(duì)凈水監(jiān)控系統(tǒng)的實(shí)時(shí)控制以及動(dòng)態(tài)生成數(shù)據(jù)報(bào)表功能。

ASP.NET；AJAX；C#；凈水處理監(jiān)控系統(tǒng)

0 引言

近年來，已出現(xiàn)了多種自動(dòng)化凈水處理監(jiān)控系統(tǒng)，但大多數(shù)是基于C/S架構(gòu)開發(fā)。這種系統(tǒng)的缺點(diǎn)是用戶界面不夠友好、客戶端需安裝配置、數(shù)據(jù)冗余度大、升級(jí)維護(hù)困難。本文介紹的是基于B/S架構(gòu)的同類系統(tǒng)開發(fā)。B/S架構(gòu)具有分布性特點(diǎn)，可以隨時(shí)隨地進(jìn)行查詢、瀏覽等業(yè)務(wù)處理。維護(hù)簡單方便，只需要改變網(wǎng)頁，即可實(shí)現(xiàn)所有用戶的同步更新。且開發(fā)簡單，共享性強(qiáng)。

1 系統(tǒng)需求分析

1.1 功能需求

（1）用戶管理：用戶登錄和注銷、已登錄用戶修改登錄密碼；

（2）凈水設(shè)備狀態(tài)實(shí)時(shí)顯示：可以實(shí)時(shí)查看到每套凈水設(shè)備的狀態(tài)；

（3）進(jìn)入設(shè)備間查看所有設(shè)備狀態(tài)：進(jìn)入設(shè)備間頁面后，系統(tǒng)會(huì)呈現(xiàn)一個(gè)模擬的設(shè)備間平面圖，在該圖上，所有設(shè)備的實(shí)時(shí)狀態(tài)都被顯示出來；

（4）根據(jù)水位自行調(diào)整閥門開閉：當(dāng)系統(tǒng)處于設(shè)備間頁面時(shí)，系統(tǒng)可以根據(jù)每套凈水設(shè)備的水位，自行調(diào)節(jié)進(jìn)水閥門和緩沖閥門的開閉狀態(tài)；

（5）動(dòng)態(tài)生成數(shù)據(jù)報(bào)表：系統(tǒng)可以根據(jù)數(shù)據(jù)庫中的數(shù)據(jù)動(dòng)態(tài)完成一張凈化水流量的數(shù)據(jù)報(bào)表，其中數(shù)據(jù)是實(shí)時(shí)更新的。

1.2 數(shù)據(jù)庫需求

系統(tǒng)主要數(shù)據(jù)庫表及內(nèi)容如下：

（1）管理員信息表：存儲(chǔ)系統(tǒng)管理員的用戶名、密碼等信息；

（2）系統(tǒng)設(shè)置信息表：存儲(chǔ)水位上限、下限閾值，系統(tǒng)自動(dòng)刷新時(shí)間間隔等信息；

（3）水泵信息表：存儲(chǔ)提升泵、反沖泵的壓力等信息；

（4）凈水設(shè)備信息表：存儲(chǔ)每臺(tái)凈水設(shè)備（當(dāng)前為4臺(tái)）的參數(shù)，主要有包括設(shè)備狀態(tài)是否正常、水位、水壓、進(jìn)水閥門和反沖閥門狀態(tài)等。

2 系統(tǒng)概要和詳細(xì)設(shè)計(jì)

2.1 開發(fā)調(diào)試環(huán)境

軟件開發(fā)環(huán)境選擇了Windows 7 Ultimate系統(tǒng)平臺(tái)。為實(shí)現(xiàn)ASP.NET和AJAX的快速開發(fā)，集成環(huán)境使用Microsoft Visual Studio 2010，開發(fā)語言選用C#。

2.2 主要類和方法

（1）公共類

作為面向?qū)ο蟮腃#語言，開發(fā)時(shí)最好將所需用到的資源等抽象為類。因此開發(fā)了以下公共類。

①WaterEquipment類，用于描述水處理設(shè)備，其中成員包括設(shè)備編號(hào)、狀態(tài)、水位、水壓、進(jìn)水閥門和緩沖閥門狀態(tài)等信息（表1）；

表1 Water Equipment類描述

②TPump類，用于描述水泵狀態(tài)，其中成員包括水泵號(hào)、名稱、壓力等信息（表2）。

表2 TPump類描述

（2）公共方法

這里的公共方法用來讀取公共資源、設(shè)置格式等。

①LoadRefreshTime方法：用于讀取自定義的刷新時(shí)間間隔，返回值為int型；

②LoadThresholdDwon方法：用來讀取數(shù)據(jù)庫中存放的水位下限閾值，返回值為double型；

③gdStyle方法：用于設(shè)置頁面中出現(xiàn)的GridView控件的格式，無返回值。

以上公共方法，均封裝在CommonClass類中，且方法均為靜態(tài)方法，這樣無須將CommonClass類實(shí)例化即可調(diào)用。

3 編碼和實(shí)現(xiàn)

由于篇幅所限，這里只介紹系統(tǒng)核心功能模塊的開發(fā)以及所應(yīng)用的關(guān)鍵技術(shù)。

3.1 導(dǎo)航功能

為便于操作，功能頁面實(shí)現(xiàn)為上+左右模式，其中上部顯示公共信息，左側(cè)顯示導(dǎo)航功能按鈕，右側(cè)為具體功能實(shí)現(xiàn)。這里采用.NET的母版頁技術(shù)，避免冗余代碼出現(xiàn)。

圖1 使用了母版頁的導(dǎo)航窗口及功能頁面

3.2 設(shè)備狀態(tài)顯示及閥門自動(dòng)控制功能

通過設(shè)備間頁面來實(shí)現(xiàn)。此頁面可以動(dòng)態(tài)顯示所有設(shè)備的各項(xiàng)參數(shù)，通過此頁面可以動(dòng)態(tài)控制閥門狀態(tài)。由于此頁面功能比較復(fù)雜，需要顯示的元素比較多，因此需要通過層次結(jié)構(gòu)來實(shí)現(xiàn)各種圖片、控件的布局，這里選擇了CSS盒子模型進(jìn)行頁面布局。

實(shí)現(xiàn)實(shí)時(shí)顯示和自動(dòng)控制功能，用到了.NET的AJAX技術(shù)。實(shí)現(xiàn)方法是首先插入U(xiǎn)pdatePanel以及Timer控件。根據(jù)布局需求，需要6個(gè)UpdatePanel控件，兩個(gè)Timer控件分別控制泵狀態(tài)和凈水設(shè)備狀態(tài)。這里需要將每個(gè)UpdatePanel的Triggers屬性均正確設(shè)置，才能保證Timer控件的Ticks事件能夠正確控制刷新。

程序流程及關(guān)鍵代碼如下：

（1）首先讀取數(shù)據(jù)庫中的水位上限和下限，建立兩個(gè)數(shù)組，分別對(duì)應(yīng)4套凈水設(shè)備和其要顯示的參數(shù)控件。然后初始化數(shù)據(jù)庫連接。

（2）通過循環(huán)控制各設(shè)備的狀態(tài)。由于定義了兩組數(shù)組，其顯示是通過數(shù)組下標(biāo)關(guān)聯(lián)的。循環(huán)體中核心代碼如下：

（3）通過讀取的水位信息來設(shè)置和顯示閥門開關(guān)。核心代碼如下：

（4）最后將存儲(chǔ)在實(shí)例化類中的信息存入數(shù)據(jù)庫并關(guān)閉數(shù)據(jù)庫連接。核心代碼如下：

該頁面的最終狀態(tài)如圖2所示。

3.3 參數(shù)報(bào)表自動(dòng)生成功能

參數(shù)報(bào)表功能實(shí)現(xiàn)使用了ASP.NET 2.0中新增的GridView控件。為實(shí)現(xiàn)定時(shí)刷新，仍需要使用UpdatePanel以及Timer控件。此處完全使用前臺(tái)模式開發(fā)，無需在后臺(tái)輸入代碼。數(shù)據(jù)庫連接使用Access-DataSource控件。

（1）首先在頁面中插入ScriptManager控件，然后依次插入兩個(gè)UpdatePanel、一個(gè)Timer、兩個(gè)AccessData-Source控件、兩個(gè)GridView控件。設(shè)置AccessData-Source控件的屬性如表3所示。

圖2 設(shè)備狀態(tài)頁面

表3 Access Data Source控件屬性

（2）然后將兩個(gè)GridView數(shù)據(jù)源分別設(shè)置為兩個(gè)AccessDataSource控件，其屬性如表4所示：

表4 Grid View控件屬性

最終的參數(shù)報(bào)表頁面見圖3。

4 系統(tǒng)部署和測試

4.1 部署

系統(tǒng)最終部署在Windows Server 2008上，采用IIS 7.0作為Web服務(wù)器，具體過程不再贅述。

圖3 數(shù)據(jù)參數(shù)表頁面

4.2 測試

對(duì)本系統(tǒng)來說，需要對(duì)照需求分析中所列出的功能需求逐一檢查系統(tǒng)功能是否正確實(shí)現(xiàn)。為了驗(yàn)證刷新功能實(shí)現(xiàn)的正確性，特地開發(fā)了配套測試程序，用于定時(shí)向數(shù)據(jù)庫中寫入隨機(jī)數(shù)據(jù)，模擬水處理設(shè)備狀態(tài)的變化。如圖4所示。

經(jīng)功能測試、人機(jī)交互界面測試、性能測試，系統(tǒng)的功能、性能等符合軟件需求規(guī)定。

5 結(jié)語

本系統(tǒng)開發(fā)過程中所采用的關(guān)鍵技術(shù)和技術(shù)優(yōu)勢(shì)包括：

①使用微軟成熟的.NET和AJAX整合架構(gòu)，使得開發(fā)過程大大簡化，后期維護(hù)、修改變得容易；

②使用CSS盒子模型進(jìn)行頁面布局，將顯示層和數(shù)據(jù)層分離，使得較復(fù)雜的設(shè)備間頁面布局層次清晰；

③充分利用了C#語言的優(yōu)勢(shì)，將各設(shè)備抽象為類進(jìn)行管理，真正做到了面向?qū)ο箝_發(fā)；

④使用ADO.NET訪問數(shù)據(jù)庫，引用成熟的類庫，訪問效率和安全性較傳統(tǒng)技術(shù)有進(jìn)一步的提升。

圖4 配套測試程序界面

當(dāng)然，系統(tǒng)開發(fā)中還存在著一些不足之處。例如網(wǎng)絡(luò)安全方面考慮不充分、系統(tǒng)配置還不夠靈活、系統(tǒng)安裝部署略顯繁瑣等，期望在后續(xù)的開發(fā)實(shí)踐中加以解決。

[1] 朱志偉.小型水廠智能化水處理監(jiān)控系統(tǒng)的應(yīng)用[J].中國給水排水，2013,16（29）:87～89

[2] 周銳.紅興隆污水處理監(jiān)控系統(tǒng)設(shè)計(jì)[D].哈爾濱：哈爾濱工業(yè)大學(xué)，2013

[3] 黃桂金，宋強(qiáng).ASP.NET AJAX網(wǎng)站開發(fā)從入門到精通[M].北京：清華大學(xué)出版社，2008

[4] Christian Wenz著.ASP.NETAJAX編程指南[M].唐學(xué)韜等譯.北京：機(jī)械工業(yè)出版社，2008

[5] 鐘大利,黃宗正.三層架構(gòu)下ADO.NET數(shù)據(jù)庫訪問技術(shù)的應(yīng)用探究[J].電腦知識(shí)與技術(shù).2013,9（5）:961～962

Development of Water Treatment Monitoring System Based on.NET and AJAX

WANG Bin1，2，HE Xing3，ZHAO Hai4,5
（1.No.91413 Troops of PLA,Qinhuangdao 066001; 2.School of Computer and Communication Engineering,Northeastern University at Qinhuangdao,Qinhuangdao 066004; 3.Unit60,No.65631 Troops of PLA,Jinzhou 121300；4.No.65037 Troops of PLA,Huludao 125100；5.College of Information and Engineering,Northeastern University,Shenyang 110819）

Describes the development process on a set of water treatmentmonitoring system based B/S structure.The system is using Micros of t.NET Framework 4.0 framework,using C#languagemainstream encodes,applying ASP.NET AJAX framework,making pages can be updated regularly without refreshing the data,to achieve real-time watermonitoring system status display function,and user experience is good. Access to the database through ADO.NET technology,water purification dynamically generated data reporting capabilities.

ASP.NET;AJAX;C#;Water TreatmentMonitoring System

1007-1423（2015）07-0073-05

10.3969/j.issn.1007-1423.2015.07.020

王斌（1981-），男，河北昌黎人，在讀碩士研究生，工程師，研究方向?yàn)檐娪密浖y評(píng)

賀興（1984-），男，河北衡水人，本科，研究方向?yàn)橥ㄐ艑?duì)抗

2015-01-13

2015-02-10