基于Web的多模式網(wǎng)絡(luò)監(jiān)控系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

靳建彬，秦藝力，張 垚

（1.中國衛(wèi)星海上測控部遠(yuǎn)望三號船通信部 江蘇 江陰 214431；2.江南計(jì)算技術(shù)研究所 江蘇 無錫 214083）

隨著計(jì)算機(jī)網(wǎng)絡(luò)在工業(yè)中的廣泛應(yīng)用，監(jiān)視、控制網(wǎng)絡(luò)設(shè)備的網(wǎng)絡(luò)監(jiān)控系統(tǒng)作用愈發(fā)重要?，F(xiàn)有網(wǎng)管系統(tǒng)普遍存在如下不足：1）缺少兼容性，實(shí)際應(yīng)用中的網(wǎng)絡(luò)系統(tǒng)通常包含多種類型的網(wǎng)絡(luò)產(chǎn)品，而網(wǎng)管系統(tǒng)一般是廠商為單類網(wǎng)絡(luò)產(chǎn)品開發(fā)，如華為公司的IManager系統(tǒng)，不能兼容如Cisco交換機(jī)、天融信防火墻等其它公司的產(chǎn)品；2）模式單一，網(wǎng)管模式主要采用服務(wù)器后臺進(jìn)行周期性輪詢機(jī)制，如華為網(wǎng)管，最小刷新間隔為1 min，網(wǎng)絡(luò)狀態(tài)監(jiān)控與故障異常報(bào)告存在延時(shí)；3）系統(tǒng)復(fù)雜，需要提供獨(dú)立網(wǎng)管服務(wù)器，耗費(fèi)資源多，不方便使用。

遠(yuǎn)洋航天測量船通信IP網(wǎng)包含不同廠商的多種網(wǎng)絡(luò)設(shè)備，需要兼容性強(qiáng)的網(wǎng)管系統(tǒng)。通信IP網(wǎng)對網(wǎng)絡(luò)的可靠性、實(shí)時(shí)性要求很高，在特殊時(shí)刻需要實(shí)時(shí)查看網(wǎng)絡(luò)狀態(tài)，并及時(shí)報(bào)告網(wǎng)絡(luò)異常。傳統(tǒng)的網(wǎng)管系統(tǒng)不能滿足測量船通信IP網(wǎng)的這些需求，為此文中開發(fā)了一種基于Web的多操作模式、兼容多種網(wǎng)絡(luò)設(shè)備的網(wǎng)絡(luò)監(jiān)控系統(tǒng)。

1 相關(guān)技術(shù)原理

文中開發(fā)的網(wǎng)絡(luò)系統(tǒng)基于Web模式，前臺利用SVG技術(shù)繪制網(wǎng)絡(luò)拓?fù)鋱D形，通過JSON-RPC進(jìn)行前臺與后臺的通信，后臺使用PYTHON技術(shù)實(shí)現(xiàn)，采用JSON格式描述網(wǎng)絡(luò)設(shè)備。

1.1 SVG

SVG是W3C（World Wide Web Consortium）制定的基于XML的可縮放矢量圖形描述規(guī)范，可用于描述矢量圖形、圖像及文字等3類圖形對象，與傳統(tǒng)的圖形格式相比，它不但占用空間小，可操作性好，并可以嵌入腳本語言以支持動畫效果和交互能力，適合在網(wǎng)絡(luò)上傳輸和顯示。它基于XML，不但與現(xiàn)有的W3C其它開放標(biāo)準(zhǔn)有很好的兼容性，也能與其它組織的標(biāo)準(zhǔn)化技術(shù)很好的協(xié)同工作，在網(wǎng)絡(luò)監(jiān)控系統(tǒng)和很多其它實(shí)時(shí)系統(tǒng)中使用SVG[1]。

SVG特點(diǎn)：

SVG是矢量圖，利用點(diǎn)和線等矢量化的數(shù)據(jù)描述圖像，在圖像中包含色彩和位置信息，圖像品質(zhì)不受設(shè)備分辨率影像，放大和縮小不影響圖像品質(zhì)。

SVG基于XML，不同于常規(guī)的圖像格式，采用文本格式描述圖像，完全支持DOM，可用程序語言動態(tài)生成。

SVG可以和Javascript結(jié)合，通過對SVG屬性進(jìn)行操作形成強(qiáng)大的顯示效果。

1.2 JSON

JSON（JavaScipt Object Notation），JavaScript對象表示法。JSON是一種結(jié)構(gòu)簡單的序列化數(shù)據(jù)格式，容易與python和JavaScipt結(jié)合，解析方便。JSON格式如下示例：

Var router={“name”: “JY -Y3-AS-003”， “ip”:“30.70.0.45”，“manufacturer”:“huawei”}

JSON以一對花括號表示對象，通過列舉以冒號分隔的名稱和值來表示每一個(gè)屬性，JavaScipt可以直接訪問JSON對象的屬性，eg:router.name，相比較XML不需要復(fù)雜的解析過程。

1.3 JSON-RPC

RPC（遠(yuǎn)程過程調(diào)用），運(yùn)行于不同操作系統(tǒng)、不同環(huán)境中的軟件通過網(wǎng)絡(luò)發(fā)送基于消息的請求進(jìn)行RPC，從而實(shí)現(xiàn)進(jìn)程間通信。JSON-RPC，是在RPC概念上發(fā)展起來的一種規(guī)范和一組實(shí)現(xiàn)方案，采用HTTP作為底層通信協(xié)議、JSON為數(shù)據(jù)編碼格式[2]。相比較以XML為數(shù)據(jù)編碼格式的XML-RPC，JSON-PRC基于簡單易用的JSON數(shù)據(jù)，具有執(zhí)行效率高、解析簡單、容易實(shí)現(xiàn)、平臺無關(guān)等特點(diǎn)。

1.4 PYTHON

Python是一種很流行的程序語言，可以作為獨(dú)立的程序和腳本在各種領(lǐng)域中應(yīng)用。Python免費(fèi)、可移植、功能強(qiáng)大，而且使用起來相當(dāng)容易[3]。

開發(fā)者效率高：

相對于C、C++和Java等編譯語言，Python的開發(fā)者效率提高了數(shù)倍。Python代碼大小只有C++或Java的五分之一，意味著可以錄入、調(diào)試和維護(hù)更少的代碼。

Python程序可以立即運(yùn)行，無需傳統(tǒng)編譯語言所必須的編譯、鏈接等步驟，進(jìn)一步提高了程序員的開發(fā)效率。

程序跨平臺、可移植：

Python的標(biāo)準(zhǔn)實(shí)現(xiàn)方式是將源代碼的語句編譯（或者說是轉(zhuǎn)換）為字節(jié)碼的形式，之后再將字節(jié)碼解釋出來.由于字節(jié)碼是一種與平臺無關(guān)的格式，字節(jié)碼具有可移植性.因此，Python語言具有跨平臺和可移植的特性，絕大多數(shù)的Python程序不做任何改變即可在所有主流計(jì)算機(jī)平臺上運(yùn)行.例如，在Linux和Windows之間移植Python代碼，只需簡單地在機(jī)器間復(fù)制代碼即可.

然而，因?yàn)镻ython沒有將代碼編譯成底層的二進(jìn)制代碼（例如intel芯片的指令），一些Python程序?qū)菴這樣的完全編譯語言慢些。

1.5 Raphael庫

Raphael是用一個(gè)小型的JavaScript庫，符合W3C標(biāo)準(zhǔn)，用于繪制和編輯SVG矢量圖形。利用Raphael創(chuàng)建的圖形具有DOM結(jié)構(gòu)，可以嵌入JavaScript腳本語言以支持動畫效果和交互能力，并能夠兼容不同瀏覽器[4]。

2 設(shè)計(jì)與實(shí)現(xiàn)

2.1 系統(tǒng)框架

文中設(shè)計(jì)基于Web方式的網(wǎng)絡(luò)監(jiān)控系統(tǒng)，包含前臺和后臺兩部分，系統(tǒng)框架如圖1所示。

圖1 多模式網(wǎng)管系統(tǒng)總體框架圖Fig.1 Structure diagram of the multi-mode network management system

用戶登陸Web瀏覽器進(jìn)入網(wǎng)絡(luò)監(jiān)控系統(tǒng)，通過前臺界面交互按鈕進(jìn)行操作，對后臺發(fā)出請求，利用JSON-RPC進(jìn)行遠(yuǎn)程服務(wù)調(diào)用，后臺執(zhí)行相關(guān)業(yè)務(wù)處理模塊并將網(wǎng)絡(luò)實(shí)時(shí)狀態(tài)信息返回給客戶端。前臺基于SVG技術(shù)和JavaScript腳本顯示或更新網(wǎng)絡(luò)拓?fù)鋱D。

2.2 網(wǎng)管系統(tǒng)前臺

前臺是用戶和綜合網(wǎng)管系統(tǒng)進(jìn)行交互操作的平臺，包括用戶交互模塊和圖形處理模塊。用戶交互模塊的功能包括：實(shí)時(shí)查看網(wǎng)絡(luò)拓?fù)洹⒃O(shè)置拓?fù)渥詣铀⑿麻g隔、重置拓?fù)涞裙δ埽粓D形處理模塊的功能包括繪制拓?fù)鋱D、更新拓?fù)鋱D等功能。這些功能主要通過定義前臺中的JavaScript腳本來實(shí)現(xiàn)。前臺的邏輯運(yùn)行框圖如圖2所示。

圖2 前臺邏輯運(yùn)行框圖Fig.2 Run block diagram of the front desk logic

用戶操作界面，在JavaScript腳本中觸發(fā)對服務(wù)端的服務(wù)請求，獲取服務(wù)端的響應(yīng)后，依據(jù)響應(yīng)的網(wǎng)絡(luò)狀態(tài)信息調(diào)用SVG庫函數(shù)繪制網(wǎng)絡(luò)拓?fù)鋱D或者更新網(wǎng)絡(luò)拓?fù)鋱D的鏈路狀態(tài)，以圖形界面的形式向用戶呈現(xiàn)網(wǎng)絡(luò)運(yùn)行狀態(tài)。下面是實(shí)時(shí)查看網(wǎng)絡(luò)拓?fù)洳僮鞯目蛻舳岁P(guān)鍵代碼片段：

//點(diǎn)擊界面中的立刻刷新按鈕，觸發(fā)相關(guān)聯(lián)的腳本

$（“#refreshButton”）.click（function（）{…}）；

//在JavaScript腳本中對服務(wù)端的服務(wù)發(fā)起請求：獲取網(wǎng)絡(luò)接口狀態(tài)，并設(shè)置回調(diào)函數(shù)為更新接口狀態(tài)函數(shù)

ajaxRequest（"getIfStatusJSONMT"， updateIfStatus）；

//在客戶端腳本中定義更新接口狀態(tài)的處理函數(shù)，根據(jù)服務(wù)端返回的接口狀態(tài)信息進(jìn)行更新處理。

updateIfStatus（）

綜合網(wǎng)管系統(tǒng)也能通過設(shè)置自動刷新間隔，實(shí)現(xiàn)自動拓?fù)渌⑿?，如圖3所示。

2.3 基于SVG的網(wǎng)絡(luò)拓?fù)滹@示

網(wǎng)絡(luò)拓?fù)淇梢钥闯墒怯删W(wǎng)絡(luò)設(shè)備（路由器、防火墻、交換機(jī)等）和連接這些網(wǎng)絡(luò)設(shè)備的鏈路組成的[5]。在SVG文件中，我們可以分別用元素表示網(wǎng)絡(luò)設(shè)備，用元素表示鏈路，用元素的相關(guān)屬性stroke顏色表示鏈路的狀態(tài)，green為正常，red為斷開，gray為未知，如圖4所示。下面是繪制拓?fù)鋱D的關(guān)鍵流程代碼：

圖3 設(shè)置拓?fù)渥詣铀⑿麻g隔Fig.3 Set topology automatic refresh interval

1）初始化SVG圖形

Var r =Raphael （"SVGHolder"，SVGHolderWidth，SVGHolderHight）；

2）設(shè)置結(jié)點(diǎn)設(shè)備初始位置、圖像

var shape=r.image（entity.image， entity.x， entity.y， 32， 32）；

3）繪制設(shè)備節(jié)點(diǎn)之間的鏈路

connection=r.connection （shapes[entity.shapeIndex]，shapes[destEntity.shapeIndex]，color，bgcolorwidth）；

4）根據(jù)設(shè)備接口狀態(tài)設(shè)置鏈路顏色

//0表示未知狀態(tài)，1為連接，2為斷開狀態(tài)

if（1） connections[i].bg.attr（{stroke:“green”}）；

else if（2） connections[i].bg.attr（{stroke:“red”}）；

else connections[i].bg.attr（{stroke:“gray”}）；

圖4 網(wǎng)絡(luò)拓?fù)滹@示圖Fig.4 Network topology shown in figure

2.4 前臺與后臺的通信

由于文中的設(shè)備信息設(shè)計(jì)為JSON格式，因此前臺與后臺的通信方式采用JSON-RPC技術(shù)。JSON-RPC基于HTTP協(xié)議，能夠獲取前臺的請求信息，傳遞給后臺相應(yīng)服務(wù)處理模塊進(jìn)行處理，并將響應(yīng)信息以JSON-RPC的格式返回給客戶 端 。 例 如 前 臺 通 過 腳 本 ajaxRequest（“getTopoJSON”，topoResponseHandle），即可直接調(diào)用后臺的函數(shù)getTopoJSON獲取網(wǎng)絡(luò)拓?fù)湫畔?，中間的調(diào)用過程由JSON-RPC完成。

2.5 系統(tǒng)后臺業(yè)務(wù)處理

綜合網(wǎng)管系統(tǒng)后臺的主要工作是對網(wǎng)絡(luò)設(shè)備進(jìn)行監(jiān)控，獲取網(wǎng)絡(luò)狀態(tài)信息，通過提供服務(wù)的方式接收并處理前臺的請求，完成與前臺的交互，實(shí)現(xiàn)網(wǎng)絡(luò)監(jiān)視功能。后臺采用層次化結(jié)構(gòu)設(shè)計(jì)，其分層結(jié)構(gòu)如圖5所示。

不同于常見的XML表示方法，文中提出一種新的方法來定義網(wǎng)絡(luò)設(shè)備，即采用JSON文件的格式，通過設(shè)置包括設(shè)備名稱、IP、接口、類型等屬性來描述網(wǎng)絡(luò)設(shè)備。這種表示方法數(shù)據(jù)結(jié)構(gòu)清晰，層次簡單，省去了復(fù)雜的XML文件DOM解析，既降低了開發(fā)的復(fù)雜度，又提高了網(wǎng)絡(luò)反應(yīng)速度。

圖5 后臺分層結(jié)構(gòu)圖Fig.5 Structure diagram of the background layers

JSON文件定義設(shè)備實(shí)例：

結(jié)點(diǎn)3{

“name”:“JY-Y3-AS-003”，

“ip”:“30.70.0.45”，

“interfaces”:{

“GigabitEthernet0/1/1”:{

“destEntity”:“JY-Y3-DS-001”，

“destInterface”:“GigabitEthernet1/0/5”

}，

…

}}}

設(shè)備模塊讀取設(shè)備定義文件，定義操作設(shè)備的基本方法。設(shè)備管理模塊管理底層設(shè)備，將設(shè)備數(shù)據(jù)提供給上層模塊。服務(wù)處理模塊封裝并提供常見服務(wù)，供前臺調(diào)用。

系統(tǒng)后臺基于SNMP協(xié)議，獲取網(wǎng)絡(luò)設(shè)備狀態(tài)信息，能夠讀取不同產(chǎn)品的私有MIB（管理信息數(shù)據(jù)庫），兼容性強(qiáng)[6]。

為提高系統(tǒng)工作效率，后臺通過多線程并行處理技術(shù)，并行獲取設(shè)備參數(shù)、狀態(tài)，大大提高了網(wǎng)絡(luò)檢索效率。

2.6 網(wǎng)管系統(tǒng)的實(shí)現(xiàn)

圖6是文中開發(fā)的網(wǎng)絡(luò)監(jiān)控系統(tǒng)的初始界面。

圖6 網(wǎng)管系統(tǒng)初始界面Fig.6 Initial interface of the network management system

從上圖可見，綜合網(wǎng)管系統(tǒng)提供了用戶操作界面，用戶可以通過刷新界面來獲取實(shí)時(shí)網(wǎng)絡(luò)信息，也可設(shè)定刷新間隔來自動進(jìn)行網(wǎng)絡(luò)監(jiān)管。

網(wǎng)絡(luò)拓?fù)鋱D基于SVG繪制，可以通過縮放圖像和拖動結(jié)點(diǎn)來顯示美觀的界面，反應(yīng)網(wǎng)絡(luò)實(shí)時(shí)狀態(tài)，便于用戶及時(shí)發(fā)現(xiàn)并處理網(wǎng)絡(luò)故障。

此網(wǎng)管系統(tǒng)的主要功能是顯示網(wǎng)絡(luò)設(shè)備的連接拓?fù)鋱D、網(wǎng)絡(luò)設(shè)備間的鏈路通斷狀態(tài)、鏈路兩端的接口信息和網(wǎng)絡(luò)設(shè)備的在線情況等。

3 結(jié) 論

文中分析了目前網(wǎng)管系統(tǒng)的不足，研究了相關(guān)開發(fā)技術(shù)的原理，針對航天遠(yuǎn)洋測控船通信IP網(wǎng)的實(shí)際需求，設(shè)計(jì)并實(shí)現(xiàn)了一種網(wǎng)絡(luò)監(jiān)控系統(tǒng)，在實(shí)際中得到應(yīng)用和驗(yàn)證。

此系統(tǒng)具有如下特點(diǎn)：兼容性強(qiáng)；實(shí)時(shí)性強(qiáng)；具有實(shí)時(shí)操作和自動監(jiān)管兩種模式；跨平臺、效率高、易部署；界面美觀友好，易操作。

[1]Ola Andersson ZOOMON AB，Phil Armstrong Corel Corporation，Henric Axelsson Ericsson AB，et al.Scalable Vector Graphics（SVG） 1.1 Specification.[EB/OL]. （2005）.http://www.w3.org/TR/SVG/.

[2]李德賢，李嵩山，李志勇.JSON-RPC協(xié)議分析、擴(kuò)展及其應(yīng)用[EB/OL].（2007-10-02）.http://www.paper.edu.cn/index.php/default/releasepaper/content/.

[3]Mark Lutz.Python學(xué)習(xí)手冊[M].機(jī)械工業(yè)出版社，2009.

[4]Dmitry Baranovskiy.Small fix to glow and animation[EB/OL].（2011）http://github.com/DmitryBaranovskiy/raphael/raw/master/paphael-min.js.

[5]熊齊邦，魯成茂.SVG和XML_RPC實(shí)現(xiàn)的Web方式網(wǎng)絡(luò)拓?fù)滹@示[J].計(jì)算機(jī)工程，2005，31（12）:220-223.XIONG Qi-bang，LU Cheng-mao.Web-based visualization of network topologies using SVG and XML-RPC[J].Computer Engineering，2005，31（12）:220-223.

[6]楊妮妮，趙新慧．基于Web的SNMP網(wǎng)絡(luò)管理[J]．微計(jì)算機(jī)信息，2006（2-3）：72，110-111.YANG Ni-ni，ZHAO Xin-hui.Web-based SNMP network management[J].Microcomputer Information，2006（2-3）：72，110-111.