張兵+姜周曙+王劍+陳震南

摘 ?要： 針對日產(chǎn)10萬噸級大型反滲透海水淡化工程，為解決海水淡化流程遠(yuǎn)程監(jiān)測系統(tǒng)中實時性弱、可靠性差、操作復(fù)雜且資源不能有效共享等問題，研制開發(fā)了一套基于B/S技術(shù)的遠(yuǎn)程監(jiān)測系統(tǒng)。該系統(tǒng)采用WCF通信模式實現(xiàn)本地監(jiān)測系統(tǒng)與遠(yuǎn)程監(jiān)測系統(tǒng)之間通信，同時使用Ajax和jQuery等網(wǎng)絡(luò)前端新技術(shù)，實現(xiàn)了頁面的局部刷新。用戶可以通過瀏覽器終端遠(yuǎn)程訪問監(jiān)控中心服務(wù)器，對海水淡化進行實時數(shù)據(jù)監(jiān)測，歷史數(shù)據(jù)查詢等操作。實際應(yīng)用表明，系統(tǒng)運行可靠、穩(wěn)定，能夠有效地加強對海水淡化生產(chǎn)過程的實時監(jiān)管。該系統(tǒng)具有較強的可移植性，可廣泛應(yīng)用子工業(yè)自動化、交通運輸?shù)雀鱾€行業(yè)，具有一定的實用價值。

關(guān)鍵詞： 反滲透海水淡化; B/S; 遠(yuǎn)程監(jiān)測; WCF; Ajax

中圖分類號： TN919?34; TP277 ? ? ? ? ? ? ?文獻標(biāo)識碼： A ? ? ? ? ? ? ? ? ? ? ? 文章編號： 1004?373X（2014）24?0001?04

Research on ?SWRO remote monitoring system based on B/S?mode

ZHANG Bing， JIANG Zhou?shu， WANG Jian， CHEN Zhen?nan

（College of Automation， Hangzhou Dianzi University， Hangzhou 310018， China）

Abstract： To solve the problems of weak real?time performance， poor reliability， complex operation and low efficiency resource sharing in the remote monitoring of the large?scale SWRO system whose daily production is 10 000 t， a remote monitoring system based on B/S technology was developed. WCF communication mode is used in this system to realize the communication between local and remote monitoring systems and the network leading technologies such as Ajax and jQuery are adopted to achieve the partial refresh in a page. The users can access the monitoring center server remotely， monitor the real?time data of the SWRO system and query the history data via browser terminal. Practical application shows that the system works reliable and stable， and can make the real?time monitoring of the SWRO process more efficient. This system has an excellent portability and can be widely applied to the industrial automation， transportation industry and so on. It is of high practical value.

Keywords： reverse osmosis desalination; B/S; remote monitoring; WCF; Ajax

0 ?引 ?言

淡水是人類社會賴以生存和發(fā)展的物質(zhì)基礎(chǔ)之一，是一切生命之源。然而，隨著社會的發(fā)展、經(jīng)濟的增長、人口的不斷增加以及環(huán)境的污染，導(dǎo)致淡水資源嚴(yán)重短缺，水資源問題已經(jīng)發(fā)展為一個全球性問題，成為制約人類社會發(fā)展的關(guān)鍵因素。在我國，淡水資源總量為28 000億m3，占世界水資源的6%，但我國人均占有量僅為世界平均水平的[14]，且分布不均，淡水資源已經(jīng)成為影響中國經(jīng)濟社會發(fā)展的重要因素[1]。然而，海洋中蘊含著豐富的淡水資源，采用反滲透海水淡化技術(shù)獲取淡水資源已成為沿海地區(qū)解決水資源問題最有效地的方法之一，受到越來越多的關(guān)注[2]。反滲透海水淡化是一個復(fù)雜的工藝流程，涉及海水的組分、pH值、溫度、產(chǎn)水量、模特性等諸多相互聯(lián)系、相互影響的變量，必須對其進行實時監(jiān)控，保證其穩(wěn)定、高效運行。

近年來， 網(wǎng)絡(luò)在工業(yè)生產(chǎn)中的應(yīng)用使得工業(yè)過程的遠(yuǎn)程監(jiān)控功能得以實現(xiàn)。隨著Internet和Web的廣泛應(yīng)用，C/S結(jié)構(gòu)已經(jīng)無法滿足當(dāng)前全球網(wǎng)絡(luò)開放、互聯(lián)和信息共享的新要求， 于是出現(xiàn)了B/S（Browser/Server）型模式，即瀏覽器/服務(wù)器結(jié)構(gòu)[3]。在B/S架構(gòu)下，任何有網(wǎng)絡(luò)的地方，用戶就可通過Web瀏覽器對工業(yè)生產(chǎn)過程進行在線實時監(jiān)測。Web瀏覽器以圖形、圖表等形式向用戶顯示當(dāng)前監(jiān)測對象的實時運行信息。采用B/S架構(gòu)的優(yōu)點是用戶可在任意平臺上實現(xiàn)對服務(wù)器的訪問，且用戶數(shù)量不限，同時利用B/S 架構(gòu)可以大大減少開發(fā)工作量，提高產(chǎn)品的可維護性[4?5]。

因此，針對目前海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)存在的不足，在物聯(lián)網(wǎng)技術(shù)的基礎(chǔ)上，提出一種基于B/S架構(gòu)的海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)，實現(xiàn)對海水淡化工藝流程的遠(yuǎn)程實時監(jiān)測。

1 ?系統(tǒng)整體架構(gòu)設(shè)計

在總體結(jié)構(gòu)設(shè)計上，反滲透海水淡化監(jiān)測系統(tǒng)采用3層架構(gòu)，整個系統(tǒng)從最底層的數(shù)據(jù)采集到用戶交互，可分為現(xiàn)場控制層、現(xiàn)場監(jiān)控層和遠(yuǎn)程監(jiān)測層。反滲透海水淡化監(jiān)控系統(tǒng)總體架構(gòu)如圖1所示。

圖1 反滲透海水淡化監(jiān)控系統(tǒng)總體架構(gòu)

現(xiàn)場控制層主要由各種傳感器、儀表以及PLC控制器組成，PLC控制器是現(xiàn)場控制層的核心，負(fù)責(zé)對現(xiàn)場各種壓力數(shù)據(jù)、流量數(shù)據(jù)等參數(shù)信號的采集，并對現(xiàn)場生產(chǎn)設(shè)備運行狀況進行實時控制。

現(xiàn)場監(jiān)控層包括交換機、現(xiàn)場監(jiān)控主機、海水淡化本地監(jiān)控系統(tǒng)、Web服務(wù)器、數(shù)據(jù)庫服務(wù)器等。本地監(jiān)控系統(tǒng)具有現(xiàn)場監(jiān)測數(shù)據(jù)的自動采集、數(shù)據(jù)處理與保存、動態(tài)顯示、遠(yuǎn)程傳輸、用戶管理等功能。系統(tǒng)采用數(shù)據(jù)挖掘、故障樹、信息融合等先進技術(shù)，對海水淡化機組運行狀態(tài)進行故障診斷、故障預(yù)測以及故障處理，提高了系統(tǒng)運行的穩(wěn)定性和可靠性，保證了機組高效運行。

反滲透海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)采用基于B/S模式的ASP.NET技術(shù)，用戶可以通過瀏覽器終端輸入海水淡化本地監(jiān)控系統(tǒng)服務(wù)器IP，以動態(tài)網(wǎng)頁的形式實時監(jiān)測海水淡化生產(chǎn)狀況，以Flash動畫、曲線等方式顯示實時監(jiān)測數(shù)據(jù)，并擁有故障報警、歷史數(shù)據(jù)查詢以及水質(zhì)監(jiān)測數(shù)據(jù)查詢等功能。系統(tǒng)設(shè)計了管理員和操作員兩種用戶權(quán)限，享有相應(yīng)權(quán)限的用戶可執(zhí)行權(quán)限內(nèi)的操作，對生產(chǎn)設(shè)備參數(shù)以及水質(zhì)情況進行遠(yuǎn)程監(jiān)控管理。只要有網(wǎng)絡(luò)的地方，就能通過瀏覽器對海水淡化整個生產(chǎn)過程進行實時在線監(jiān)測，獲取海水淡化設(shè)備實時運行信息。系統(tǒng)功能架構(gòu)如圖2所示。

圖2 遠(yuǎn)程監(jiān)測系統(tǒng)功能架構(gòu)

2 ?軟件實現(xiàn)的關(guān)鍵技術(shù)

2.1 ?遠(yuǎn)程WCF通信

WCF是Microsoft為構(gòu)建面向服務(wù)的應(yīng)用提供的分布式通信編程框架，是.NET的重要組成部分，使用該框架，開發(fā)人員可以構(gòu)建跨平臺、安全、可靠和支持事務(wù)處理的企業(yè)級互聯(lián)應(yīng)用解決方案[6]。WCF通信模型如圖3所示， 客戶端與服務(wù)端通過消息在匹配的訪問點之間進行信息交互， 基于消息的通信機制是 SOA架構(gòu)的特點[7]。服務(wù)端作用是實現(xiàn)服務(wù)并對客服端進行相應(yīng)，主要包括服務(wù)契約的設(shè)計和實現(xiàn)以及配置WCF服務(wù)的Endpoint設(shè)置。

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)采用OPC通信[8]和WCF通信相結(jié)合的通信方式，本地監(jiān)測系統(tǒng)通過OPC通信方式讀取PLC控制器上的數(shù)據(jù)，并且通過WCF通信方式向Web網(wǎng)頁發(fā)送本地監(jiān)控端采集的時間監(jiān)測數(shù)據(jù)，實現(xiàn)對海水淡化整個運作過程的遠(yuǎn)程實時監(jiān)測。

<＼＼192.168.6.11＼現(xiàn)代電子技術(shù)14年37卷第24期＼Image＼07t3.tif>

圖3 WCF通信模型

2.1.1 ?WCF服務(wù)的實現(xiàn)

本地監(jiān)測軟件是基于.NET的Windows窗體應(yīng)用程序，開發(fā)工具是VS 2008，WCF選擇本地監(jiān)控軟件作為承載服務(wù)的宿主，遠(yuǎn)程監(jiān)測系統(tǒng)通過互聯(lián)網(wǎng)調(diào)用WCF服務(wù)提供的遠(yuǎn)程方法。系統(tǒng)中定義了一個IMoveDataContract接口和一個MoveDataContractsService類，用于為遠(yuǎn)程監(jiān)測端提供遠(yuǎn)程服務(wù)，服務(wù)契約設(shè)計如表1所示。

表1 服務(wù)契約設(shè)計

定義好接口后，定義一個MoveDataContractsService類實現(xiàn)接口中定義的抽象函數(shù)。服務(wù)實現(xiàn)后在服務(wù)的宿主本地監(jiān)測軟件的程序配置文件App.config文件中用XML語言定義終結(jié)點額地址、綁定和契約。配置文件中的代碼如下所示。

behaviorConfiguration="metadataBehavior"

name="DesailinationWCF.MoveDataContract

sService">

actsService” ? binding="wsHttpBinding"

contract="DesailinationWCF.IMoveDataContract"/>

2.1.2 ?遠(yuǎn)程監(jiān)測端即客戶端的實現(xiàn)

遠(yuǎn)程監(jiān)測軟件的開發(fā)工具是VS 2008，啟動海水淡化本地監(jiān)控軟件即服務(wù)端后在工程中添加服務(wù)應(yīng)用，工具自動生成代理類并配置訪問點。在遠(yuǎn)程監(jiān)測系統(tǒng)中實例化代理并調(diào)用服務(wù)契約中的函數(shù)，從而實現(xiàn)服務(wù)的調(diào)用。

2.2 ?Ajax技術(shù)在前臺網(wǎng)頁中的實現(xiàn)

Ajax是一種使用客戶端腳本并能與Web服務(wù)器交互的客戶端Web開發(fā)技術(shù)，它的特點在于Ajax是基于客戶端的，并能夠以異步的方式與服務(wù)器交互[5]。Ajax根據(jù)“按需取數(shù)據(jù)”的原則，大大降低了冗余請求及響應(yīng)對服務(wù)器照成的負(fù)擔(dān)[9]。無刷新更新頁面減少了用戶心理和實際等待時間，它只和服務(wù)器交換有用的數(shù)據(jù)，而頁面元素、樣式等一些不必要的數(shù)據(jù)就不重新從服務(wù)器端加載，減少了寬帶消耗[10]。海水淡化本地監(jiān)測系統(tǒng)中，系統(tǒng)每隔8 s采用OPC通信協(xié)議從PLC控制器中讀取一次數(shù)據(jù)，在遠(yuǎn)程監(jiān)測系統(tǒng)中，為了顯示最新采集的實時監(jiān)測數(shù)據(jù)，系統(tǒng)必須每隔幾秒刷新一下界面，以顯示最新監(jiān)測數(shù)據(jù)。傳統(tǒng)方法是用在Aspx頁面開頭head中加Refresh標(biāo)簽

來實現(xiàn)，這種方法會刷新不需要更新的頁面元素使整個頁面回發(fā)，增加界面響應(yīng)時間，并影響用戶對界面的操作。為避免出現(xiàn)整體閃動提高頁面響應(yīng)速度，系統(tǒng)使用Ajax技術(shù)來對界面進行定時局部刷新。系統(tǒng)需要刷新的界面使用ASP.NET Ajax腳本庫ScriptManager，UpdatePanel 和 Timer定時器來對系統(tǒng)局部空間進行刷新[10]，主要代碼如下所示：

<！—需要定時刷新的控件或THML元素 -->

ControlID="TimerRaise"EventName="Tick" />

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)，每隔8 s觸發(fā)一次定時器事件，對界面進行局部刷新，顯示海水淡化過程中設(shè)備以及水質(zhì)參數(shù)等實時數(shù)據(jù)，實現(xiàn)對反滲透海水淡化工藝的遠(yuǎn)程實時監(jiān)測，保證系統(tǒng)穩(wěn)定高效的運行。

2.3 ?jQuery在系統(tǒng)的應(yīng)用

為了使界面具有更好的靈活性和友好性，系統(tǒng)開發(fā)周期更短，該系統(tǒng)中使用一個JavaScript著名的開源庫jQuery技術(shù)，jQuery以簡單的代碼實現(xiàn)更強大的功能簡潔、快速、靈活的JavaScript框架[9]。引入jQuery后，開發(fā)人員能做到“寫得更少，做得更多”，能將JS代碼和HTML代碼完全分離，便于代碼的維護和修改，從而減少網(wǎng)絡(luò)頁面布局時間，提高開發(fā)效率[11]。

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)中大量使用了jQuery插件，由于其具有和墻的擴展功能，根據(jù)系統(tǒng)的實際需要進行了大量的代碼擴展，以滿足系統(tǒng)的需要。大量插件在系統(tǒng)中的運用實現(xiàn)了與Ajax技術(shù)的完美融合。應(yīng)用時將jQuery框架文件保存在項目文件夾JS中，在頁面的

加入以下代碼：

系統(tǒng)使用該插件來控制界面中實時監(jiān)測數(shù)據(jù)的曲線動態(tài)顯示，界面更加友好。

3 ?系統(tǒng)主要功能模塊的設(shè)計與實現(xiàn)

3.1 ?Flash動畫顯示界面

用戶由系統(tǒng)登錄界面通過輸入相應(yīng)的用戶名和密碼，經(jīng)Web服務(wù)器驗證通過后進入遠(yuǎn)程監(jiān)測系統(tǒng)的Flash動畫顯示界面，如圖4所示，該界面提供Flash動畫模擬現(xiàn)場生產(chǎn)工藝流程，把海水淡化工藝流程、特點、工作原理以動畫的形式立體呈現(xiàn)出來，并在動畫中顯示生產(chǎn)設(shè)備參數(shù)以及各階段水質(zhì)狀況等監(jiān)測數(shù)據(jù)，使用戶直觀、詳實、全方位動態(tài)的監(jiān)測海水淡化機組的實時運行狀況。同時，在網(wǎng)頁的左側(cè)欄提供相應(yīng)關(guān)鍵數(shù)據(jù)的報警信號。點擊界面上的鏈接可以跳轉(zhuǎn)到相應(yīng)的界面，如數(shù)據(jù)曲線顯示界面、信息查詢界面、水質(zhì)查詢界面、故障報警界面等。

3.2 ?數(shù)據(jù)文本顯示界面

該界面顯示了海水淡化過程中所有的監(jiān)測數(shù)據(jù)，包括電機參數(shù)，水質(zhì)參數(shù)，流量參數(shù)，液位參數(shù)以及壓力參數(shù)。并根據(jù)海水淡化工藝流程，將實時數(shù)據(jù)按預(yù)處理、前處理和反滲透等幾個階段分開顯示，使數(shù)據(jù)顯示更加清晰有條理。數(shù)據(jù)文本顯示界面如圖5所示。

圖5 數(shù)據(jù)文本顯示界面

3.3 ?數(shù)據(jù)曲線顯示界面

數(shù)據(jù)曲線網(wǎng)頁采用HighCharts控件對不同類型的數(shù)據(jù)進行分開顯示，如流量數(shù)據(jù)、壓力數(shù)據(jù)、水質(zhì)參數(shù)數(shù)據(jù)等。系統(tǒng)定時繪制監(jiān)測數(shù)據(jù)動態(tài)曲線，使用戶對監(jiān)測數(shù)據(jù)的整體變化趨勢有更直觀的了解。曲線顯示界面如圖6所示。

圖6 曲線顯示界面

3.4 ?信息查詢界面

歷史數(shù)據(jù)查詢界面包括歷史數(shù)據(jù)查詢以及各水質(zhì)監(jiān)測點的水質(zhì)監(jiān)測數(shù)據(jù)查詢。系統(tǒng)采用數(shù)據(jù)庫是SQL Server 2005， SQL Server是一個關(guān)系數(shù)據(jù)庫，具有強大的數(shù)據(jù)處理功能。用戶可自主選擇查詢條件，點擊查詢按鈕，向Web服務(wù)器提交用戶查詢請求。Web服務(wù)器調(diào)用數(shù)據(jù)庫服務(wù)器中的相應(yīng)數(shù)據(jù)，發(fā)送回頁面進行表格數(shù)據(jù)顯示。數(shù)據(jù)表格采用分頁技術(shù)，每頁顯示固定的數(shù)據(jù)行，用戶對海量數(shù)據(jù)的查詢一目了然。歷史數(shù)據(jù)查詢界面如圖7所示。

圖7 歷史數(shù)據(jù)查詢界面

4 ?結(jié) ?語

本文設(shè)計了一種適合對反滲透海水淡化整套生產(chǎn)設(shè)備進行遠(yuǎn)程在線監(jiān)測，獲取設(shè)備實時運行狀況的新型遠(yuǎn)程監(jiān)測系統(tǒng)，并給出系統(tǒng)的總體結(jié)構(gòu)。該系統(tǒng)基于B/S架構(gòu)，監(jiān)測端可以位于任何與Internet相連的地方，使用戶可以方便有效地掌握系統(tǒng)的運行狀況。系統(tǒng)采用WCF通信模式，實現(xiàn)本地監(jiān)測系統(tǒng)與遠(yuǎn)程監(jiān)測系統(tǒng)之間的通信，同時，系統(tǒng)使用Ajax和jQuery等網(wǎng)絡(luò)前端新技術(shù)，實現(xiàn)了頁面的局部刷新，提高了頁面的響應(yīng)速度，使用戶界面更加友好。

參考文獻

[1] 張利平，夏軍，胡志芳.中國水資源狀況與水資源安全問題分析[J].長江流域資源與環(huán)境，2009（2）：116?120.

[2] 馮廣軍.海水淡化：解決淡水資源短缺的有效方案[J].華北電力技術(shù)，2005（3）：41?44.

[3] 陳若珠，劉承倩，駱東松，等. B/S構(gòu)架的工業(yè)遠(yuǎn)程監(jiān)測系統(tǒng)的研究[J].自動化儀表，2010（4）：32?34.

[4] 李廣鑫，馬志欣，丁振國，等.基于B/S結(jié)構(gòu)的遠(yuǎn)程實時監(jiān)測系統(tǒng)[J].計算機應(yīng)用研究，2003（10）：147?150.

[5] 廖玉霞.基于B/S模式的水環(huán)境監(jiān)測系統(tǒng)設(shè)計與實現(xiàn)[D].成都：電子科技大學(xué)，2013.

[6] 顧悅，王建軍.基于WCF的遠(yuǎn)程數(shù)據(jù)訪問技術(shù)研究[J].電腦知識與技術(shù)，2010（31）：8675?8676.

[7] 韓旭，王海波，柳克俊.基于.NET Framework WCF的面向服務(wù)SOA中間件設(shè)計[J].小型微型計算機系統(tǒng)，2010（12）：2359?2364.

[8] 龔攀峰.基于OPC技術(shù)的城市能源監(jiān)測系統(tǒng)的研究[D].廣州：華南理工大學(xué)，2012.

[9] 高鵬，徐小力，吳國新，等.基于Ajax的四層架構(gòu)遠(yuǎn)程監(jiān)測系統(tǒng)設(shè)計[J].計算機工程與設(shè)計，2014（2）：695?699.

[10] 黃志春.基于AJAX技術(shù)的環(huán)保監(jiān)控系統(tǒng)[D].杭州：浙江大學(xué)，2006.

[11] 周玲余.基于jQuery框架的頁面前端特效的設(shè)計與實現(xiàn)[J]. 計算機與現(xiàn)代化，2013（1）：61?63.

<！—需要定時刷新的控件或THML元素 -->

ControlID="TimerRaise"EventName="Tick" />

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)，每隔8 s觸發(fā)一次定時器事件，對界面進行局部刷新，顯示海水淡化過程中設(shè)備以及水質(zhì)參數(shù)等實時數(shù)據(jù)，實現(xiàn)對反滲透海水淡化工藝的遠(yuǎn)程實時監(jiān)測，保證系統(tǒng)穩(wěn)定高效的運行。

2.3 ?jQuery在系統(tǒng)的應(yīng)用

為了使界面具有更好的靈活性和友好性，系統(tǒng)開發(fā)周期更短，該系統(tǒng)中使用一個JavaScript著名的開源庫jQuery技術(shù)，jQuery以簡單的代碼實現(xiàn)更強大的功能簡潔、快速、靈活的JavaScript框架[9]。引入jQuery后，開發(fā)人員能做到“寫得更少，做得更多”，能將JS代碼和HTML代碼完全分離，便于代碼的維護和修改，從而減少網(wǎng)絡(luò)頁面布局時間，提高開發(fā)效率[11]。

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)中大量使用了jQuery插件，由于其具有和墻的擴展功能，根據(jù)系統(tǒng)的實際需要進行了大量的代碼擴展，以滿足系統(tǒng)的需要。大量插件在系統(tǒng)中的運用實現(xiàn)了與Ajax技術(shù)的完美融合。應(yīng)用時將jQuery框架文件保存在項目文件夾JS中，在頁面的

加入以下代碼：

系統(tǒng)使用該插件來控制界面中實時監(jiān)測數(shù)據(jù)的曲線動態(tài)顯示，界面更加友好。

3 ?系統(tǒng)主要功能模塊的設(shè)計與實現(xiàn)

3.1 ?Flash動畫顯示界面

用戶由系統(tǒng)登錄界面通過輸入相應(yīng)的用戶名和密碼，經(jīng)Web服務(wù)器驗證通過后進入遠(yuǎn)程監(jiān)測系統(tǒng)的Flash動畫顯示界面，如圖4所示，該界面提供Flash動畫模擬現(xiàn)場生產(chǎn)工藝流程，把海水淡化工藝流程、特點、工作原理以動畫的形式立體呈現(xiàn)出來，并在動畫中顯示生產(chǎn)設(shè)備參數(shù)以及各階段水質(zhì)狀況等監(jiān)測數(shù)據(jù)，使用戶直觀、詳實、全方位動態(tài)的監(jiān)測海水淡化機組的實時運行狀況。同時，在網(wǎng)頁的左側(cè)欄提供相應(yīng)關(guān)鍵數(shù)據(jù)的報警信號。點擊界面上的鏈接可以跳轉(zhuǎn)到相應(yīng)的界面，如數(shù)據(jù)曲線顯示界面、信息查詢界面、水質(zhì)查詢界面、故障報警界面等。

3.2 ?數(shù)據(jù)文本顯示界面

該界面顯示了海水淡化過程中所有的監(jiān)測數(shù)據(jù)，包括電機參數(shù)，水質(zhì)參數(shù)，流量參數(shù)，液位參數(shù)以及壓力參數(shù)。并根據(jù)海水淡化工藝流程，將實時數(shù)據(jù)按預(yù)處理、前處理和反滲透等幾個階段分開顯示，使數(shù)據(jù)顯示更加清晰有條理。數(shù)據(jù)文本顯示界面如圖5所示。

圖5 數(shù)據(jù)文本顯示界面

3.3 ?數(shù)據(jù)曲線顯示界面

數(shù)據(jù)曲線網(wǎng)頁采用HighCharts控件對不同類型的數(shù)據(jù)進行分開顯示，如流量數(shù)據(jù)、壓力數(shù)據(jù)、水質(zhì)參數(shù)數(shù)據(jù)等。系統(tǒng)定時繪制監(jiān)測數(shù)據(jù)動態(tài)曲線，使用戶對監(jiān)測數(shù)據(jù)的整體變化趨勢有更直觀的了解。曲線顯示界面如圖6所示。

圖6 曲線顯示界面

3.4 ?信息查詢界面

歷史數(shù)據(jù)查詢界面包括歷史數(shù)據(jù)查詢以及各水質(zhì)監(jiān)測點的水質(zhì)監(jiān)測數(shù)據(jù)查詢。系統(tǒng)采用數(shù)據(jù)庫是SQL Server 2005， SQL Server是一個關(guān)系數(shù)據(jù)庫，具有強大的數(shù)據(jù)處理功能。用戶可自主選擇查詢條件，點擊查詢按鈕，向Web服務(wù)器提交用戶查詢請求。Web服務(wù)器調(diào)用數(shù)據(jù)庫服務(wù)器中的相應(yīng)數(shù)據(jù)，發(fā)送回頁面進行表格數(shù)據(jù)顯示。數(shù)據(jù)表格采用分頁技術(shù)，每頁顯示固定的數(shù)據(jù)行，用戶對海量數(shù)據(jù)的查詢一目了然。歷史數(shù)據(jù)查詢界面如圖7所示。

圖7 歷史數(shù)據(jù)查詢界面

4 ?結(jié) ?語

本文設(shè)計了一種適合對反滲透海水淡化整套生產(chǎn)設(shè)備進行遠(yuǎn)程在線監(jiān)測，獲取設(shè)備實時運行狀況的新型遠(yuǎn)程監(jiān)測系統(tǒng)，并給出系統(tǒng)的總體結(jié)構(gòu)。該系統(tǒng)基于B/S架構(gòu)，監(jiān)測端可以位于任何與Internet相連的地方，使用戶可以方便有效地掌握系統(tǒng)的運行狀況。系統(tǒng)采用WCF通信模式，實現(xiàn)本地監(jiān)測系統(tǒng)與遠(yuǎn)程監(jiān)測系統(tǒng)之間的通信，同時，系統(tǒng)使用Ajax和jQuery等網(wǎng)絡(luò)前端新技術(shù)，實現(xiàn)了頁面的局部刷新，提高了頁面的響應(yīng)速度，使用戶界面更加友好。

參考文獻

[1] 張利平，夏軍，胡志芳.中國水資源狀況與水資源安全問題分析[J].長江流域資源與環(huán)境，2009（2）：116?120.

[2] 馮廣軍.海水淡化：解決淡水資源短缺的有效方案[J].華北電力技術(shù)，2005（3）：41?44.

[3] 陳若珠，劉承倩，駱東松，等. B/S構(gòu)架的工業(yè)遠(yuǎn)程監(jiān)測系統(tǒng)的研究[J].自動化儀表，2010（4）：32?34.

[4] 李廣鑫，馬志欣，丁振國，等.基于B/S結(jié)構(gòu)的遠(yuǎn)程實時監(jiān)測系統(tǒng)[J].計算機應(yīng)用研究，2003（10）：147?150.

[5] 廖玉霞.基于B/S模式的水環(huán)境監(jiān)測系統(tǒng)設(shè)計與實現(xiàn)[D].成都：電子科技大學(xué)，2013.

[6] 顧悅，王建軍.基于WCF的遠(yuǎn)程數(shù)據(jù)訪問技術(shù)研究[J].電腦知識與技術(shù)，2010（31）：8675?8676.

[7] 韓旭，王海波，柳克俊.基于.NET Framework WCF的面向服務(wù)SOA中間件設(shè)計[J].小型微型計算機系統(tǒng)，2010（12）：2359?2364.

[8] 龔攀峰.基于OPC技術(shù)的城市能源監(jiān)測系統(tǒng)的研究[D].廣州：華南理工大學(xué)，2012.

[9] 高鵬，徐小力，吳國新，等.基于Ajax的四層架構(gòu)遠(yuǎn)程監(jiān)測系統(tǒng)設(shè)計[J].計算機工程與設(shè)計，2014（2）：695?699.

[10] 黃志春.基于AJAX技術(shù)的環(huán)保監(jiān)控系統(tǒng)[D].杭州：浙江大學(xué)，2006.

[11] 周玲余.基于jQuery框架的頁面前端特效的設(shè)計與實現(xiàn)[J]. 計算機與現(xiàn)代化，2013（1）：61?63.

<！—需要定時刷新的控件或THML元素 -->

ControlID="TimerRaise"EventName="Tick" />

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)，每隔8 s觸發(fā)一次定時器事件，對界面進行局部刷新，顯示海水淡化過程中設(shè)備以及水質(zhì)參數(shù)等實時數(shù)據(jù)，實現(xiàn)對反滲透海水淡化工藝的遠(yuǎn)程實時監(jiān)測，保證系統(tǒng)穩(wěn)定高效的運行。

2.3 ?jQuery在系統(tǒng)的應(yīng)用

為了使界面具有更好的靈活性和友好性，系統(tǒng)開發(fā)周期更短，該系統(tǒng)中使用一個JavaScript著名的開源庫jQuery技術(shù)，jQuery以簡單的代碼實現(xiàn)更強大的功能簡潔、快速、靈活的JavaScript框架[9]。引入jQuery后，開發(fā)人員能做到“寫得更少，做得更多”，能將JS代碼和HTML代碼完全分離，便于代碼的維護和修改，從而減少網(wǎng)絡(luò)頁面布局時間，提高開發(fā)效率[11]。

海水淡化遠(yuǎn)程監(jiān)測系統(tǒng)中大量使用了jQuery插件，由于其具有和墻的擴展功能，根據(jù)系統(tǒng)的實際需要進行了大量的代碼擴展，以滿足系統(tǒng)的需要。大量插件在系統(tǒng)中的運用實現(xiàn)了與Ajax技術(shù)的完美融合。應(yīng)用時將jQuery框架文件保存在項目文件夾JS中，在頁面的

加入以下代碼：

系統(tǒng)使用該插件來控制界面中實時監(jiān)測數(shù)據(jù)的曲線動態(tài)顯示，界面更加友好。

3 ?系統(tǒng)主要功能模塊的設(shè)計與實現(xiàn)

3.1 ?Flash動畫顯示界面

用戶由系統(tǒng)登錄界面通過輸入相應(yīng)的用戶名和密碼，經(jīng)Web服務(wù)器驗證通過后進入遠(yuǎn)程監(jiān)測系統(tǒng)的Flash動畫顯示界面，如圖4所示，該界面提供Flash動畫模擬現(xiàn)場生產(chǎn)工藝流程，把海水淡化工藝流程、特點、工作原理以動畫的形式立體呈現(xiàn)出來，并在動畫中顯示生產(chǎn)設(shè)備參數(shù)以及各階段水質(zhì)狀況等監(jiān)測數(shù)據(jù)，使用戶直觀、詳實、全方位動態(tài)的監(jiān)測海水淡化機組的實時運行狀況。同時，在網(wǎng)頁的左側(cè)欄提供相應(yīng)關(guān)鍵數(shù)據(jù)的報警信號。點擊界面上的鏈接可以跳轉(zhuǎn)到相應(yīng)的界面，如數(shù)據(jù)曲線顯示界面、信息查詢界面、水質(zhì)查詢界面、故障報警界面等。

3.2 ?數(shù)據(jù)文本顯示界面

該界面顯示了海水淡化過程中所有的監(jiān)測數(shù)據(jù)，包括電機參數(shù)，水質(zhì)參數(shù)，流量參數(shù)，液位參數(shù)以及壓力參數(shù)。并根據(jù)海水淡化工藝流程，將實時數(shù)據(jù)按預(yù)處理、前處理和反滲透等幾個階段分開顯示，使數(shù)據(jù)顯示更加清晰有條理。數(shù)據(jù)文本顯示界面如圖5所示。

圖5 數(shù)據(jù)文本顯示界面

3.3 ?數(shù)據(jù)曲線顯示界面

數(shù)據(jù)曲線網(wǎng)頁采用HighCharts控件對不同類型的數(shù)據(jù)進行分開顯示，如流量數(shù)據(jù)、壓力數(shù)據(jù)、水質(zhì)參數(shù)數(shù)據(jù)等。系統(tǒng)定時繪制監(jiān)測數(shù)據(jù)動態(tài)曲線，使用戶對監(jiān)測數(shù)據(jù)的整體變化趨勢有更直觀的了解。曲線顯示界面如圖6所示。

圖6 曲線顯示界面

3.4 ?信息查詢界面

歷史數(shù)據(jù)查詢界面包括歷史數(shù)據(jù)查詢以及各水質(zhì)監(jiān)測點的水質(zhì)監(jiān)測數(shù)據(jù)查詢。系統(tǒng)采用數(shù)據(jù)庫是SQL Server 2005， SQL Server是一個關(guān)系數(shù)據(jù)庫，具有強大的數(shù)據(jù)處理功能。用戶可自主選擇查詢條件，點擊查詢按鈕，向Web服務(wù)器提交用戶查詢請求。Web服務(wù)器調(diào)用數(shù)據(jù)庫服務(wù)器中的相應(yīng)數(shù)據(jù)，發(fā)送回頁面進行表格數(shù)據(jù)顯示。數(shù)據(jù)表格采用分頁技術(shù)，每頁顯示固定的數(shù)據(jù)行，用戶對海量數(shù)據(jù)的查詢一目了然。歷史數(shù)據(jù)查詢界面如圖7所示。

圖7 歷史數(shù)據(jù)查詢界面

4 ?結(jié) ?語

本文設(shè)計了一種適合對反滲透海水淡化整套生產(chǎn)設(shè)備進行遠(yuǎn)程在線監(jiān)測，獲取設(shè)備實時運行狀況的新型遠(yuǎn)程監(jiān)測系統(tǒng)，并給出系統(tǒng)的總體結(jié)構(gòu)。該系統(tǒng)基于B/S架構(gòu)，監(jiān)測端可以位于任何與Internet相連的地方，使用戶可以方便有效地掌握系統(tǒng)的運行狀況。系統(tǒng)采用WCF通信模式，實現(xiàn)本地監(jiān)測系統(tǒng)與遠(yuǎn)程監(jiān)測系統(tǒng)之間的通信，同時，系統(tǒng)使用Ajax和jQuery等網(wǎng)絡(luò)前端新技術(shù)，實現(xiàn)了頁面的局部刷新，提高了頁面的響應(yīng)速度，使用戶界面更加友好。

參考文獻

[1] 張利平，夏軍，胡志芳.中國水資源狀況與水資源安全問題分析[J].長江流域資源與環(huán)境，2009（2）：116?120.

[2] 馮廣軍.海水淡化：解決淡水資源短缺的有效方案[J].華北電力技術(shù)，2005（3）：41?44.

[3] 陳若珠，劉承倩，駱東松，等. B/S構(gòu)架的工業(yè)遠(yuǎn)程監(jiān)測系統(tǒng)的研究[J].自動化儀表，2010（4）：32?34.

[4] 李廣鑫，馬志欣，丁振國，等.基于B/S結(jié)構(gòu)的遠(yuǎn)程實時監(jiān)測系統(tǒng)[J].計算機應(yīng)用研究，2003（10）：147?150.

[5] 廖玉霞.基于B/S模式的水環(huán)境監(jiān)測系統(tǒng)設(shè)計與實現(xiàn)[D].成都：電子科技大學(xué)，2013.

[6] 顧悅，王建軍.基于WCF的遠(yuǎn)程數(shù)據(jù)訪問技術(shù)研究[J].電腦知識與技術(shù)，2010（31）：8675?8676.

[7] 韓旭，王海波，柳克俊.基于.NET Framework WCF的面向服務(wù)SOA中間件設(shè)計[J].小型微型計算機系統(tǒng)，2010（12）：2359?2364.

[8] 龔攀峰.基于OPC技術(shù)的城市能源監(jiān)測系統(tǒng)的研究[D].廣州：華南理工大學(xué)，2012.

[9] 高鵬，徐小力，吳國新，等.基于Ajax的四層架構(gòu)遠(yuǎn)程監(jiān)測系統(tǒng)設(shè)計[J].計算機工程與設(shè)計，2014（2）：695?699.

[10] 黃志春.基于AJAX技術(shù)的環(huán)保監(jiān)控系統(tǒng)[D].杭州：浙江大學(xué)，2006.

[11] 周玲余.基于jQuery框架的頁面前端特效的設(shè)計與實現(xiàn)[J]. 計算機與現(xiàn)代化，2013（1）：61?63.