《電子技術(shù)應(yīng)用》
您所在的位置:首頁 > 其他 > 設(shè)計(jì)應(yīng)用 > 基于DWR反向AJAX的Web監(jiān)控系統(tǒng)
基于DWR反向AJAX的Web監(jiān)控系統(tǒng)
來源:微型機(jī)與應(yīng)用2010年第13期
呂海東1,,高際邦2
1.大連理工大學(xué) 城市學(xué)院,,遼寧 大連 116600;2.大連英科時(shí)代科技發(fā)展有限公司,,大連 116
摘要: 采用DWR框架和反向AJAX,,結(jié)合Java多線程技術(shù)和Siemens Simatic S7-400 PLC TCP/IP通訊模塊CP243-1 IT,開發(fā)了新的Web監(jiān)控系統(tǒng),,并應(yīng)用在供熱公司供熱管路監(jiān)控系統(tǒng)中,。其替代了原有的C/S模式的工業(yè)控制機(jī),達(dá)到了用戶的功能需求,。
Abstract:
Key words :

摘  要: 采用DWR框架和反向AJAX,,結(jié)合Java多線程技術(shù)和Siemens Simatic S7-400 PLC TCP/IP通訊模塊CP243-1 IT,開發(fā)了新的Web監(jiān)控系統(tǒng),,并應(yīng)用在供熱公司供熱管路監(jiān)控系統(tǒng)中,。其替代了原有的C/S模式的工業(yè)控制機(jī),達(dá)到了用戶的功能需求,。
關(guān)鍵詞: Web監(jiān)控,;DWR;AJAX,;推技術(shù)

    目前Web監(jiān)控系統(tǒng)已經(jīng)得到了普遍運(yùn)用,,許多新的監(jiān)控系統(tǒng)都采用了Web作為監(jiān)控系統(tǒng)的客戶端,極大方便了監(jiān)控系統(tǒng)的操作管理人員,,減輕了監(jiān)控系統(tǒng)的維護(hù)成本,。如何解決傳統(tǒng)Web監(jiān)控系統(tǒng)的數(shù)據(jù)讀取請求/響應(yīng)模式的缺點(diǎn),以及監(jiān)測數(shù)據(jù)顯示頁面刷新的難題[1],,一直是Web監(jiān)控系統(tǒng)開發(fā)人員不懈努力的難題,。
    在實(shí)現(xiàn)Web監(jiān)控系統(tǒng)的技術(shù)多種多樣,各有千秋,,AJAX技術(shù)成為首選之一,,不論服務(wù)器端采用JavaEE還是MS.NET平臺(tái)。雖然AJAX解決了整個(gè)監(jiān)控畫面的局部刷新問題,,但AJAX依然采用HTTP請求/響應(yīng)模式讀取服務(wù)器端取得的Web監(jiān)控?cái)?shù)據(jù)[2],。AJAX框架DWR[3]最新版本推出了反向AJAX技術(shù),使數(shù)據(jù)從服務(wù)器推送到Web客戶端成為可能,,滿足了監(jiān)控系統(tǒng)實(shí)時(shí)性要求,。
    采用DWR框架和反向AJAX,結(jié)合Java多線程技術(shù)和Siemens Simatic S7-400 PLC TCP/IP通訊模塊CP243-1 IT,開發(fā)了新的Web監(jiān)控系統(tǒng),,并在供熱公司供熱管路監(jiān)控系統(tǒng)中實(shí)際運(yùn)用,。替換了原有的C/S模式的工業(yè)控制機(jī),達(dá)到了用戶的功能需求,。
1 DWR技術(shù)
1.1 DWR框架

    DWR(Direct Web Remoting)是一個(gè)Web遠(yuǎn)程調(diào)用AJAX擴(kuò)展框架,,通過DWR客戶端的JavaScript可以直接調(diào)用Web服務(wù)器上的JavaBean類的方法,解決了原有AJAX應(yīng)用必需請求HTTP控制組件(如Servlet,,Struts的Action等)才能調(diào)用服務(wù)器端業(yè)務(wù)類的方法,,從而簡化了AJAX應(yīng)用的開發(fā)。使用DWR可以不需要編寫復(fù)雜的控制層組件,。
1.2 DWR反向AJAX技術(shù)
    正常情況下,,DWR調(diào)用服務(wù)器端的JavaBean對象方法使用正向請求/響應(yīng)模式,也稱為拉模式(Pull Model),,由客戶端JavaScript調(diào)用JavaBean方法,,返回結(jié)果通過回調(diào)方法更新頁面上的HTML元素,實(shí)現(xiàn)監(jiān)控?cái)?shù)據(jù)的顯示,。這種正向模式符合一般的管理系統(tǒng)應(yīng)用,,但對監(jiān)控系統(tǒng)實(shí)時(shí)性要求較高的應(yīng)用卻力不從心。而反向模式即推模式(Push Model),,是適應(yīng)監(jiān)控系統(tǒng)的最佳方式,,由服務(wù)器組件將取得的監(jiān)控?cái)?shù)據(jù)推送到Web客戶端,不需要客戶端主動(dòng)請求,,而是被動(dòng)接收,。因而無需進(jìn)行Web層進(jìn)行頁面刷新,即可實(shí)現(xiàn)數(shù)據(jù)更新顯示,。
    最新版本的DWR 2.X增加了反向(Reverse AJAX)功能,,通過反向AJAX功能,服務(wù)器端的JavaBean對象可以將取得的數(shù)據(jù)直接推送到指定的客戶端頁面,,寫到指定的HTML元素內(nèi),,這個(gè)過程不需要客戶端進(jìn)行任何的請求操作,。
2 監(jiān)控系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)
2.1 總體結(jié)構(gòu)

    整個(gè)監(jiān)控系統(tǒng)采用下位監(jiān)控子系統(tǒng),、上位Web服務(wù)器和客戶端三層結(jié)構(gòu),如圖1所示,。


    下位監(jiān)控子系統(tǒng)采用Siemens Simatic S7-400 PLC,,連接溫度、壓力及流量傳感器,,并配置TCP/IP通信控制單元(CP343),。上位Web服務(wù)器采用開源Tomcat6.0.20,它針對新的JDK6進(jìn)行了性能的優(yōu)化,極大提高了響應(yīng)速度,,滿足監(jiān)控實(shí)時(shí)性需求,,在Tomcat6 Web中配置DWR Servlet,負(fù)責(zé)與客戶端Javascript進(jìn)行通信,,服務(wù)器端使用JavaBean多線程技術(shù),,通過Socket和TCP/IP協(xié)議與PLC通信,讀取PLC監(jiān)控?cái)?shù)據(jù),,使用DWR反向AJAX技術(shù)將監(jiān)控?cái)?shù)據(jù)推向客戶端的HTML元素進(jìn)行顯示,。客戶端使用IE瀏覽器被動(dòng)接收服務(wù)器推送的數(shù)據(jù),,實(shí)時(shí)更新監(jiān)測數(shù)據(jù),。
2.2 服務(wù)器端DWR配置
    為使用DWR,需要在/WEB-INF/web.xml中配置DWR Servlet,,并設(shè)定請求URL地址,,同時(shí)通過設(shè)置參數(shù)activeReverseAjaxEnabled為true來啟用反向AJAX。配置代碼如下:
    <servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
          <init-param>
             <param-name>activeReverseAjaxEnabled</param-name>
             <param-value>true</param-value>
          </init-param>
          <init-param>
            <param-name>pollAndCometEnabled</param-name>
             <param-value>true</param-value>
          </init-param>
          <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
             <servlet-name>dwr-invoker</servlet-name>
             <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>
2.3 監(jiān)控業(yè)務(wù)單元JavaBean編程
    (1)服務(wù)器端JavaBean
    以多線程方式,,每個(gè)監(jiān)測點(diǎn)為獨(dú)立的線程,,使用TCP/IP和Socket讀取Siemens Simatic S7 PLC的監(jiān)測數(shù)據(jù),并使用DWR Reverse AJAX和DOM直接寫入到客戶端的HTML中,。其中一個(gè)監(jiān)測點(diǎn)線程示意代碼如下:
    public void run() throws InterruptedException
    {
        WebContext wctx=WebContextFactory.get(),;
        String currentPage=wctx.getCurrentPage();
        Collection sessions=wctx.getScriptSessionsByPage(currentPage),;
              //通過TCP/IP讀取PLC指定監(jiān)測點(diǎn)的數(shù)據(jù)
        double data=PLCRemote.getData(ip,,siteNo);
        Util utilAll=new Util(sessions),;
         //將監(jiān)測數(shù)據(jù)通過DWR反向AJAX直接寫入客戶HTML頁面<div>元素中
        utilAll.setValue(siteNo,,String.valueOf(date));
    }
    關(guān)鍵是使用DWR反向AJAX的Util對象的setValue方法,,將監(jiān)測數(shù)據(jù)寫到DIV元素id為siteNo值的單元中,。
    (2)配置JavaBean到DWR
    使用DWR的配置文件/WEB-INF/dwr.xml,將JavaBean引入到DWR體系中,,通過JavaScript就可以直接調(diào)用JavaBean的監(jiān)測方法,。
    <dwr>
      <allow>
        <convert match=“com.lushu.control.value.*” converter=“bean”></convert>
        <create creator=“new” javascript=“DataChecking”>
          <param name=“class” value=“com.lushu.control.business.DataChecking”/>
        </create>
      </allow>
    </dwr>
其中,javascript屬性指定JavaScript中對象的名稱,,creator=“new”指定由DWR引擎自動(dòng)創(chuàng)建JavaBean類的實(shí)例,。
2.4 客戶端實(shí)現(xiàn)
    客戶端使用DWR代碼庫,用JavaScript結(jié)合HTML,,DOM實(shí)現(xiàn)監(jiān)控Web頁面的數(shù)據(jù)顯示,。為節(jié)省篇幅,,只介紹重點(diǎn)配置和示意代碼。
    (1)引入DWR代碼庫
    這里使用HTML與JavaScript分離原則,,JavaScript代碼放在單獨(dú)的JS文件中,。
    <script type=‘text/javascript’ src=‘/lsweb/dwr/util.js’></script>
    <script type=‘text/javascript’ src=‘/lsweb/dwr/interface/DataChecking.js’></script>
    <script type=‘text/javascript’ src=‘/lsweb/dwr/engine.js’></script>
    <script type=‘text/javascript’ src=‘main.js’></script>
    (2)啟用DWR反向AJAX
    在main.js中定義所有監(jiān)控業(yè)務(wù)的函數(shù)。
    function checkInit()
    {   dwr.engine.setActiveReverseAjax(true),;  }
    window.onload=checkInit,;
    (3)定義監(jiān)控?cái)?shù)據(jù)接收HTML單元
    在監(jiān)控頁面上使用<div id=”測點(diǎn)ID”></div>定義DWR反向AJAX推送數(shù)據(jù)的顯示位置,由服務(wù)器端JavaBean通過DWR AJAX直接讀取,??蛻舳隧撁婧蚃avaScript不需進(jìn)行任何請求操作。部分測點(diǎn)示意如下:
    <tr>
     <td>一小區(qū)#2</td>
     <td><div id=“no01”></div></td>
     <td><div id=“no02”></div></td>
     <td><div id=“no03”></div></td>
    </tr>
    (4)JavaScript調(diào)用JavaBean方法
    啟動(dòng)服務(wù)器端JavaBean監(jiān)測方法讀取PLC數(shù)據(jù),,進(jìn)行數(shù)據(jù)推送,。在監(jiān)測方法內(nèi)啟動(dòng)所有監(jiān)測點(diǎn)的監(jiān)測線程,實(shí)時(shí)監(jiān)測數(shù)據(jù)并推送到客戶端,。
    function startChecking()
    {
       //通過DWR直接調(diào)用服務(wù)器端JavaBean的監(jiān)測數(shù)據(jù)方法
       DataChecking.sendCheckData(),;
    }
    結(jié)合JavaEE平臺(tái)、AJAX,、DWR和反向AJAX,,實(shí)現(xiàn)了一個(gè)全新的無需頁面刷新、無需進(jìn)行HTTP請求的全新Web監(jiān)控系統(tǒng),,解決了傳統(tǒng)Web的HTTP請求/響應(yīng)模式無法滿足監(jiān)控系統(tǒng)實(shí)時(shí)性要求的難題,。尤其是反向AJAX技術(shù)實(shí)現(xiàn)的推模式,可以將服務(wù)器端監(jiān)測數(shù)據(jù)直接通過TCP/IP推送到HTML客戶端,,并直接寫入到HTML元素中,,得以實(shí)現(xiàn)與現(xiàn)有Web監(jiān)控系統(tǒng)傳統(tǒng)模式完全不同的全新系統(tǒng),實(shí)現(xiàn)了無需進(jìn)行頁面刷新的工作模式,。由于只傳輸監(jiān)控?cái)?shù)據(jù),,無需傳輸數(shù)據(jù)格式HTML代碼,系統(tǒng)性能得到了極大改善,,滿足了監(jiān)控系統(tǒng)對實(shí)時(shí)性的要求,。今后無刷新、推模式的Web監(jiān)控系統(tǒng)必將得到廣泛應(yīng)用,。
參考文獻(xiàn)
[1] 陳群.基于ASP.NET AJAX新型Web Scada的設(shè)計(jì)與實(shí)現(xiàn)[J].工業(yè)控制計(jì)算機(jī),,2009(6):42-44.
[2] 張景峰,劉海燕,,張?jiān)品?基于組播的局域網(wǎng)多態(tài)監(jiān)控系統(tǒng)[J].微計(jì)算機(jī)信息,,2009(18):76-77.
[3] 扎米蒂.DWR實(shí)戰(zhàn)[M].北京:人民郵電出版社,2009.

此內(nèi)容為AET網(wǎng)站原創(chuàng),,未經(jīng)授權(quán)禁止轉(zhuǎn)載,。