基于AJAX技術(shù)的電力監(jiān)控系統(tǒng)的開發(fā)與應(yīng)用

黃磊明，王黎明

?

基于AJAX技術(shù)的電力監(jiān)控系統(tǒng)的開發(fā)與應(yīng)用

黃磊明，王黎明

（海軍工程大學(xué) 電氣工程學(xué)院，武漢 430033）

目前，電力系統(tǒng)的監(jiān)控在電能質(zhì)量管理中具有重要的地位和作用。傳統(tǒng)的監(jiān)控平臺(tái)采用的仍然是主從模式，這種模式要求在上位機(jī)安裝一個(gè)單獨(dú)的監(jiān)控軟件，在開發(fā)、部署、維護(hù)、更新等方面相對(duì)繁瑣。基于AJAX技術(shù)的電力監(jiān)控系統(tǒng)突破了這種傳統(tǒng)的監(jiān)控?cái)?shù)據(jù)的顯示方式，采用的B/S改進(jìn)模式使得用戶僅需要一個(gè)通用瀏覽器即可實(shí)現(xiàn)數(shù)據(jù)的監(jiān)控，方便快捷，成本低廉。同時(shí)，監(jiān)控也不再受地理位置的限制，可實(shí)現(xiàn)系統(tǒng)及設(shè)備的遠(yuǎn)程診斷和分析。

電力監(jiān)控 AJAX 瀏覽器

0 引言

電力作為國家的基礎(chǔ)行業(yè)之一，不斷推動(dòng)著國民經(jīng)濟(jì)的快速發(fā)展。隨著用電需求的逐步擴(kuò)大，電能質(zhì)量越來越受到人們的重視。用戶需要更加有效的電力監(jiān)控管理解決方案來應(yīng)對(duì)上述變化帶來的挑戰(zhàn)，以實(shí)現(xiàn)電力系統(tǒng)持續(xù)、可靠、穩(wěn)定的運(yùn)行。傳統(tǒng)的平臺(tái)監(jiān)控采用的仍然是C/S模式[1]，即電壓、電流、開關(guān)狀態(tài)等信號(hào)量從底層的下位機(jī)采集以后，通過數(shù)據(jù)傳輸接口送到集控臺(tái)進(jìn)行處理，這種模式就要求在集控臺(tái)開發(fā)一個(gè)單獨(dú)的應(yīng)用程序，才能對(duì)終端設(shè)備進(jìn)行監(jiān)測(cè)和控制。由于需要將可執(zhí)行文件安裝到集控臺(tái)，程序的部署及其更新的復(fù)雜性一直是困擾用戶和開發(fā)人員的問題。AJAX技術(shù)則可突破這種傳統(tǒng)的顯示方式，用戶僅需要一個(gè)通用瀏覽器即可實(shí)現(xiàn)數(shù)據(jù)的監(jiān)控，方便快捷，大大地降低了部署維護(hù)成本。而且，監(jiān)控也不再受地理位置的限制，可實(shí)現(xiàn)系統(tǒng)及設(shè)備的遠(yuǎn)程診斷和分析。

1 AJAX模型的工作機(jī)制

傳統(tǒng)的Web應(yīng)用模型采用的是同步交互的方式[2]。當(dāng)下位機(jī)在處理請(qǐng)求的時(shí)候，用戶多數(shù)時(shí)間只能處于等待狀態(tài)，監(jiān)控頁面中顯示的內(nèi)容也只是一片空白。而且由于下位機(jī)需要進(jìn)行復(fù)雜的數(shù)據(jù)處理并返回一個(gè)完整的HTML頁面至集控臺(tái)，所以用戶可能需要較長時(shí)間的等待。

電力監(jiān)控系統(tǒng)引入AJAX引擎后，用戶操作與下位機(jī)響應(yīng)便可實(shí)現(xiàn)異步化。與傳統(tǒng)的Web應(yīng)用不同，在電力數(shù)據(jù)開始傳輸時(shí)，瀏覽器不是首先將整個(gè)監(jiān)控頁面裝入，而是先加載AJAX引擎。AJAX引擎顯示用戶界面并代理用戶與下位機(jī)溝通。用戶發(fā)送請(qǐng)求后不必等待下位機(jī)的響應(yīng)，用戶可以繼續(xù)使用瀏覽器完成其它操作，比如下一個(gè)指令的填寫。下位機(jī)接到AJAX引擎發(fā)送來的請(qǐng)求后做出處理，返回結(jié)果，并改變HTTP就緒狀態(tài)。AJAX引擎監(jiān)聽到HTTP的就緒狀態(tài)發(fā)生改變，則調(diào)用對(duì)應(yīng)的函數(shù)來接收處理結(jié)果并以此更新頁面的指定部分[3]。瀏覽器并不需要刷新整個(gè)監(jiān)控頁面，只是更新頁面的部分內(nèi)容，整個(gè)過程不必打斷用戶與應(yīng)用的交互，減少了網(wǎng)絡(luò)延遲帶給用戶體驗(yàn)的不便。

圖1 傳統(tǒng)Web應(yīng)用模型和AJAX模型

2 AJAX技術(shù)在電力監(jiān)控中的典型應(yīng)用

電力系統(tǒng)需要監(jiān)控的參數(shù)有很多，主要包括電流、電壓、功率等模擬量，斷路器、隔離開關(guān)、閘刀等設(shè)備的開關(guān)狀態(tài)以及環(huán)境溫度、濕度、酸堿度等指標(biāo)。當(dāng)電力系統(tǒng)發(fā)生短路、斷路、失火等故障時(shí)，監(jiān)控系統(tǒng)應(yīng)能夠進(jìn)行實(shí)時(shí)報(bào)警和遙測(cè)遙控。AJAX技術(shù)由來已久，其中為大眾所熟知的應(yīng)用是Google Maps，引入電力監(jiān)控尚屬首次?；贏JAX技術(shù)的電力監(jiān)控系統(tǒng)結(jié)合了眾多的編程技術(shù)，例如XMLHttpRequest實(shí)現(xiàn)異步交互、DOM實(shí)現(xiàn)局部刷新、JavaScript承上啟下以及CSS豐富頁面效果，突破了傳統(tǒng)的監(jiān)控方式，人機(jī)交互更加智能化[4]。

2.1開關(guān)量輸入輸出

開關(guān)量傳感器發(fā)出的信號(hào)是接點(diǎn)信號(hào)，有斷開和閉合兩種狀態(tài)，用以指示刀開關(guān)、斷路器、接觸器、繼電器等設(shè)備的運(yùn)行狀態(tài)。尤其是當(dāng)電力系統(tǒng)發(fā)生跳閘故障時(shí)，可以起到很好的警示作用。以指示燈的狀態(tài)響應(yīng)為例：

if(led1.responseText == "ON")

{

obj1.style.backgroundColor='#0F0'

obj1.style.fontSize='25px';

alert("Now the state of the first switch : closed.");

}

else

{

obj1.innerHTML =

obj1.style.backgroundColor='#F00';

obj1.style.fontSize='25px';

alert("Now the state of the first switch : open.");

}

代碼中涉及到XMLHttpRequest提供的responseText屬性，實(shí)現(xiàn)了以字符串方式取得下位機(jī)回傳的數(shù)據(jù)[5]。通過回傳值led1.responseText與ON和OFF的比較，分別彈出不同的對(duì)話框內(nèi)容，提示第一路的開關(guān)狀態(tài)。這使得用戶只同下位機(jī)進(jìn)行電力數(shù)據(jù)層面的交換，而不用每次都刷新整個(gè)界面，并且數(shù)據(jù)處理的工作轉(zhuǎn)移到了集控臺(tái)，這樣既減輕了下位機(jī)的負(fù)擔(dān)又加快了響應(yīng)速度、縮短了用戶的等候時(shí)間。

圖2 開關(guān)量輸入輸出頁面

2.2模擬量輸入

圖3模擬量輸入頁面

位于電力系統(tǒng)底層的傳感器把諸多過程參數(shù)如電流、電壓、頻率等模擬量信號(hào)經(jīng)過前置放大、采樣保持、模數(shù)轉(zhuǎn)換后，通過接口電路以數(shù)字量信號(hào)送入集控臺(tái)，從而完成對(duì)電參量的監(jiān)測(cè)任務(wù)。圖3即為電壓采集頁面，程序代碼如下所示：

sString = s.responseText;

varmyString = new String(sString);

var mv1 = myString.substring(1,6);

通過例4進(jìn)一步推導(dǎo)可知，若極限式中有冪指函數(shù)地f(x)g(x)，常用換底公式eg(x)lnf(x)將其化為指數(shù)函數(shù)進(jìn)行處理。

var ev1 = myString.substring(7,12);

var mv2 = myString.substring(13,18);

var ev2 = myString.substring(19,24);

……

通過利用JavaScript中的substring方法獲取多個(gè)字符，可以實(shí)現(xiàn)局部刷新web頁面顯示可編程邏輯控制器上傳的電壓數(shù)據(jù)。JavaScript在這里起到了一個(gè)承上啟下的作用：一方面，它通過其屬性和方法操作DOM，將用戶請(qǐng)求通過XMLHttpRequest對(duì)象實(shí)現(xiàn)與下位機(jī)的異步交互通信；另一方面，AJAX利用JavaScript的特性實(shí)現(xiàn)對(duì)用戶行為的實(shí)時(shí)響應(yīng)與處理[6]。

2.3模擬量輸出

圖4模擬量輸出頁面

模擬量輸出的目的是把集控臺(tái)發(fā)出的數(shù)字量信號(hào)轉(zhuǎn)換成模擬量電壓或電流信號(hào)，去驅(qū)動(dòng)相應(yīng)的執(zhí)行器，從而達(dá)到控制的目的。脈沖寬度調(diào)制（PWM）便是利用微處理器的數(shù)字輸出來對(duì)模擬電路進(jìn)行控制的一種非常有效的技術(shù)，廣泛應(yīng)用在從測(cè)量、通信到功率控制與變換的許多領(lǐng)域中。本例中可實(shí)現(xiàn)的功能主要包括：

1．6個(gè)獨(dú)立的輸出通道，通過編程可控制其輸出波形的頻率（即周期）。

2．每一個(gè)PWM輸出通道都能調(diào)制出占空比從0-100%變化的波形。

3．周期和脈寬可以被雙緩沖。

4．具有遇到緊急情況可關(guān)閉相應(yīng)輸出通道。

這里用到了文檔中一個(gè)非常重要的事件，那就是鼠標(biāo)事件。在JavaScript中，使用onclick事件來表示鼠標(biāo)單擊事件，使用ondblclick事件來表示鼠標(biāo)雙擊事件[7]。本例中，通過單擊按鈕“PWM1ON/OFF”，觸發(fā)pwm_onoff1()函數(shù)，就可實(shí)現(xiàn)PWM1的開關(guān)轉(zhuǎn)換，代碼如下：

2.4其他測(cè)量

電力系統(tǒng)的環(huán)境溫度、濕度、酸堿度等因素對(duì)其穩(wěn)定運(yùn)行有著至關(guān)重要的影響。以溫度測(cè)量為例，傳感器將采集的溫度參數(shù)上傳至下位機(jī)，集控臺(tái)的瀏覽器打開后，即運(yùn)行文檔載入事件onLoad事件，加載測(cè)溫函數(shù)gettemp()，并利用setTimeout()函數(shù)實(shí)現(xiàn)動(dòng)態(tài)間隔500ms獲取芯片溫度。

圖5測(cè)溫頁面

在動(dòng)態(tài)顯示溫度時(shí)，還用到了DOM中的document 對(duì)象的getElementById()方法：document.getElementById("temp").innerHTML ="";其作用是將回傳值gettemp.responseText返回到指定id—temp屬性innerHTML中。這里的document對(duì)象代表了整個(gè)XML的文檔，所有其它的節(jié)點(diǎn)，都以一定的順序包含在document對(duì)象之內(nèi)，排列成一個(gè)樹形的結(jié)構(gòu)，通過遍歷這棵樹可以來得到XML文檔的所有的內(nèi)容，然后再來執(zhí)行后續(xù)的修改、添加、刪除等操作。

2.5頁面設(shè)計(jì)

CSS層疊樣式表出現(xiàn)彌補(bǔ)了HTML超文本標(biāo)記語言在格式修飾中的不足，同時(shí)能夠?qū)崿F(xiàn)頁面格式的批量動(dòng)態(tài)更新。通過使用腳本與CSS結(jié)合，動(dòng)態(tài)控制頁面元素的位置、色彩等屬性，可進(jìn)一步豐富頁面的動(dòng)態(tài)效果[8]。

CSS定義的方式有很多種，包括嵌入方式、行內(nèi)方式和外部鏈接方式等[9]。嵌入方式和行內(nèi)方式定義后的CSS只對(duì)該網(wǎng)頁起作用，這對(duì)于一個(gè)大型網(wǎng)站來說也是很麻煩的，而且大部分工作都是重復(fù)的。外部鏈接方式定義CSS就能很好地解決該問題。外部鏈接是通過將CSS定義成一個(gè)單獨(dú)文件，當(dāng)使用CSS時(shí)，就將其引入到相應(yīng)的網(wǎng)頁文件中。這樣不但可以節(jié)省工作量，也更易于維護(hù)整個(gè)網(wǎng)站。例如：

其中01_same.css和01_index.css分別是定義成一個(gè)單獨(dú)文件的CSS。

3 結(jié)束語

通過AJAX技術(shù)在電力監(jiān)控系統(tǒng)中的應(yīng)用，實(shí)現(xiàn)了局部刷新Web頁面顯示可編程邏輯控制器上傳的電壓、電流等數(shù)據(jù)，向用戶提供電力系統(tǒng)底層受控點(diǎn)的實(shí)時(shí)運(yùn)行狀態(tài)信息，最大程度地減少了冗余請(qǐng)求，節(jié)約了網(wǎng)絡(luò)帶寬，減少了用戶心理和實(shí)際的等待時(shí)間，提高了用戶網(wǎng)絡(luò)體驗(yàn)的質(zhì)量。同時(shí)，通過集控臺(tái)的Web頁面遠(yuǎn)程控制PLC的模擬量、開關(guān)量輸出，提高了處理效率，監(jiān)控方式也更加智能化。隨著電力網(wǎng)絡(luò)的不斷發(fā)展，作為監(jiān)控系統(tǒng)智能化的重要支持的服務(wù)器也會(huì)越來越重要。如何設(shè)計(jì)更加友好的網(wǎng)頁界面，建立一個(gè)高性能、安全、快速、兼容性好的服務(wù)器也是未來發(fā)展的趨勢(shì)。

[1] 龔海燕. 基于C/S模式的網(wǎng)絡(luò)遠(yuǎn)程監(jiān)控系統(tǒng)[D]. 南京航空航天大學(xué), 2003.

[2] 周東星, 李心科. 基于MVC和MAX的Web開發(fā)模型的設(shè)計(jì)與應(yīng)用[J]. 合肥工業(yè)大學(xué)學(xué)報(bào), 2008, 31(9): 1438.

[3] 徐紅升, 張瑞玲. 基于SSH整合MVC分層的網(wǎng)上商城的設(shè)計(jì)與實(shí)現(xiàn)[J]. 洛陽師范學(xué)院學(xué)報(bào), 2013, 32(2): 76.

[4] Andy Zaidman, Nick Matthijssen, Margaret-Anne Storey, Arie van Deursen. Understanding Ajax applications by connecting client and server-side execution traces [J]. Empirical Software Engineering, 2013, 18(2): 181-218.

[5] 曹衍龍, 葉達(dá)峰. Ajax編程技術(shù)與實(shí)例[M]. 北京: 人民郵電出版社, 2007.

[6] Alessandro Marchetto, Filippo Ricca, Paolo Tonella. A case study-based comparison of web testing techniques applied to AJAX web applications[J]. International Journal on Software Tools for Technology Transfer, 2008, 10(6): 477-492.

[7] 熊文, 熊淑華, 孫旭, 張朝陽. Ajax技術(shù)在Web2. 0網(wǎng)站設(shè)計(jì)中的應(yīng)用研究[J]. 計(jì)算機(jī)技術(shù)與發(fā)展, 2012, 22(3), 147.

[8] B. Douglas Blansit. An Introduction to Cascading Style Sheets (CSS)[J]. Journal of Electronic Resources in Medical Libraries, 2008, 5(4): 395-409.

[9] David Powers. The Essential Guide to Dreamweaver CS4 with CSS, Ajax, and PHP[M]. Springer-Verlag New York Inc, 2009.

Development and Application of the Power Monitoring System Based on AJAX Technology

Huang Leiming, Wang Liming

(College of Electrical Engineering, Naval University of Engineering, Wuhan 430033)

At present, the power monitoring plays an important role in the power quality management. Traditional monitoring platform is still the master and slave mode, which requires installing a separate monitoring software on the upper computer, so that it is relatively complicated in development, deployment, maintenance, update and other aspects. The power monitoring system based on AJAX technology has broken through the traditional display mode. The modified B/S model makes it come true that the users only need a general browser to achieve data monitoring, which is convenient and budget. At the same time, the monitoring is no longer limited by geographical location, and the remote diagnosis and analysis of system and equipment becomes reality.

power monitoring; AJAX; browser

TP391.8

A

1003-4862（2016）04-0019-04

2015-11-10

黃磊明（1987-），男，碩士研究生。研究方向：檢測(cè)技術(shù)與自動(dòng)化裝置、故障錄波技術(shù)。

王黎明（1979-），男，副教授，碩士研究生導(dǎo)師。研究方向：電網(wǎng)自動(dòng)化調(diào)度與管理技術(shù)、嵌入式系統(tǒng)設(shè)計(jì)與開發(fā)。