DWR+VML实时曲线

要求做一个WEB端的服务器实时流量利用率监控曲线！
具体做法是后台采用SNMP4J采集服务器流量，前台采用DWR调用后台Bean得到数据，然后利用VML显示曲线。

1、DWR配置，先把DWR.jar加入到WEB-INF/lib下。
    在web.xml下加入如下片段：

< servlet >
         < servlet-name > dwr-invoker </ servlet-name >
         < servlet-class > org.directwebremoting.servlet.DwrServlet </ servlet-class >
         < init-param >
             < param-name > debug </ param-name >
             < param-value > true </ param-value >
         </ init-param >
     </ servlet >
     < servlet-mapping >
         < servlet-name > dwr-invoker </ servlet-name >
         < url-pattern > /dwr/* </ url-pattern >
     </ servlet-mapping >

2、加入SNMP4J.JAR包，将SNMP4J.JAR加入到WEB-INF/lib下，写好流量采集代码，如下：

  1  package  com.wingo.util;
  2 
  3 
  4  import  org.snmp4j.CommunityTarget;
  5  import  org.snmp4j.PDU;
  6  import  org.snmp4j.Snmp;
  7  import  org.snmp4j.TransportMapping;
  8  import  org.snmp4j.event.ResponseEvent;
  9  import  org.snmp4j.smi.Address;
 10  import  org.snmp4j.smi.GenericAddress;
 11  import  org.snmp4j.smi.OID;
 12  import  org.snmp4j.smi.OctetString;
 13  import  org.snmp4j.smi.VariableBinding;
 14  import  org.snmp4j.transport.DefaultUdpTransportMapping;
 15 
 16  /**
 17   * snmp代理工具类
 18 
 19   * 
 20   * <pre>
 21   * ***************************************************************
 22   * Copyright.  Wingo 2006 ALL RIGHTS RESERVED.
 23   *
 24   * This software is only to be used for the purpose for which it
 25   * has been provided.  No part of it is to be reproduced,
 26   * disassembled, transmitted, stored in a retrieval system or
 27   * translated in any human or computer language in any way or
 28   * for any other purposes whatsoever without the prior written
 29   * consent of Wingo.
 30   * ***************************************************************
 31   *
 32   * Class Name: SnmpUtil.java
 33   * Creation Date: 2007-8-6
 34   * Description: 
 35   * 
 36   * Amendment Date   CMM/PPCRNo.    Programmer      Description
 37   * 2007-8-6                        Administartor         create
 38   * </pre>
 39   * 
 40   *  @author  Administartor
 41   *  @version  1.0
 42    */
 43  public   class  SnmpUtil {
 44 
 45       public   static   final   int  version1  =   0 ;
 46 
 47       public   static   final   int  version2c  =   1 ;
 48 
 49       public   static   final   int  version3  =   3 ;
 50 
 51       private   static  TransportMapping transport  =   null ;
 52       private   static  Snmp protocol  =   null ;
 53       /**
 54       * 创建snmp连接
 55        */
 56     
 57       public   static  Snmp createSnmp() {
 58           try  {
 59               //  设定采取的协议
 60              TransportMapping transport  =   new  DefaultUdpTransportMapping();
 61               if  ( false   &&  transport  ==   null   ||  protocol  ==   null ) {
 62                  transport  =   new  DefaultUdpTransportMapping();
 63                  protocol  =   new  Snmp(transport);
 64                  transport.listen();
 65              }
 66               return  protocol;
 67          }
 68           catch  (Exception ex) {
 69              ex.printStackTrace();
 70          }
 71           return   null ;
 72      }
 73      
 74       /**
 75       * 连接目标机器
 76       * url格式：udp:192.168.1.168/161 community:默认是public   
 77        */
 78       public   static  CommunityTarget createTarget(String url, String community,  int  version) {
 79           //  设定CommunityTarget
 80          CommunityTarget myTarget  =   new  CommunityTarget();
 81          Address deviceAdd  =  GenericAddress.parse(url);
 82          myTarget.setAddress(deviceAdd);
 83          myTarget.setCommunity( new  OctetString(community));
 84          myTarget.setRetries( 2 );
 85          myTarget.setTimeout( 5   *   60 );
 86          myTarget.setVersion(version); //  org.snmp4j.mp.*;
 87           return  myTarget;
 88      }
 89 
 90       /**
 91       * 获取当前OID的值，如果不存在返回null
 92       * url 格式为udp:192.168.1.168/161
 93        */
 94       public   static  PDU get(String url, String community,  int  version, String oid) {
 95           return  get(url,community,version2c, oid, PDU.GET);
 96      }
 97 
 98       /**
 99       * 获取当前OID的下一个节点的值
100       * 格式为udp:192.168.1.168/161
101        */
102       public   static  PDU getNext(String url, String community,  int  version, String oid) {
103           return  get(url,community,version2c, oid, PDU.GETNEXT);
104      }
105      
106       /**
107       * 得到一个PDU类
108        */
109       private   static  PDU get(String url, String community,  int  version, String oid, int  type) {
110           try  {
111              Snmp protocol  =  createSnmp();
112              CommunityTarget target  =  createTarget(url, community, version);
113              VariableBinding var  =   new  VariableBinding( new  OID(oid));
114              
115              PDU request  =   new  PDU();
116              request.add(var);
117              request.setType(type);  // PDU.GETNEXT
118              ResponseEvent responseEvent  =  protocol.send(request, target);
119 
120               return  responseEvent.getResponse(); 
121          }  catch  (Exception ex) {
122              ex.printStackTrace();
123          }
124           return   null ;
125      }
126      
127       /**
128       * 获得具体的值，在此为了测试，采用随机数
129       *  @return
130        */
131       public   double  getValue(){
132           double  value  =   0  ;
133          String url  =   " udp:192.168.1.38/161 " ; 
134          String community  =   " public " ;
135           int  version  =  SnmpUtil.version2c;
136          PDU response  =  SnmpUtil.get(url, community, version,  " 1.3.6.1.2.1.2.2.1.10 " ,PDU.GETNEXT); 
137           for  ( int  i  =   0 ; response  !=   null   &&  i  <  response.size(); i ++ ) {
138              value  =  response.get( 0 ).getVariable().toLong(); // 取得当前的值
139          }
140           // 下面一行代码为方便测试采用产生随机数，由于在页面上是利用率，所以前面取得当前值的时候要把它计算成当前利用率
141          value  =  Math.random() * 100  ;
142           return   value;
143      }
144 
145       public   static   void  main(String[] str) {
146          String url  =   " udp:192.168.1.38/161 " ; 
147          String community  =   " public " ;
148           int  version  =  SnmpUtil.version2c;
149          
150           try  {
151              PDU response  =  SnmpUtil.get(url, community, version,  " 1.3.6.1.2.1.2.2.1.10 " ,PDU.GETNEXT); 
152               for  ( int  i  =   0 ; response  !=   null   &&  i  <  response.size(); i ++ ) {
153                  System.out.println( " *****  "   +  response.get( 0 ).getVariable());
154              }
155          }  catch  (Exception ex) {
156              ex.printStackTrace();
157          }
158          
159      }
160 
161  }
162 

3、配置DWR函数调用：
    在WEB-INF文件夹下创建dwr.xml文件，具体代码如下：

<? xml version="1.0" encoding="gbk" ?>
<! DOCTYPE dwr PUBLIC 
    "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN" 
    "http://www.getahead.ltd.uk/dwr/dwr10.dtd" >

< dwr >
     < allow >
         < create  creator ="new"  javascript ="SnmpUtil" >
             < param  name ="class"  value ="com.wingo.util.SnmpUtil"   />
         </ create >
     </ allow >
</ dwr >

4、页面调用：

 1  <% @ page language = " java "  import = " java.util.* "  pageEncoding = " UTF-8 " %>
 2  < html  xmlns:v ="urn:schemas-microsoft-com:vml" >
 3       < head >
 4           < title > 动态创建VML </ title >
 5       </ head >
 6       < STYLE >
 7   v\:*  {  BEHAVIOR :  url(#default#VML)  }
 8  </ STYLE >
 9  < script  language ="JavaScript" >
10  var  art  =   new  Array( 21 ); // 定义数据存储数组
11  var  str  =  '';     //  线的数据组合
12  for (i = 0 ;i <= 20 ;i ++ ){     // 初始化一条直线，在坐标的底部
13      art[i]  =  i  *   10   +   " ,200  " ;
14      str  =  str  +  art[i];
15  }
16 
17  // 绘制一条性能曲线。
18  function  createLine(str){
19       if (document.getElementById( " temp " )){
20           var  temp  =  document.getElementById( " temp " );
21          temp.removeNode( true ); // 把原来的线，删除。
22      }
23 
24       var  strElement = ' < v:PolyLine id = " temp "  filled = " false "  Points = " '+ str +' "  style = " position:relative " /> ';
25 
26       var  newPoint  =  document.createElement(strElement);
27      group1.insertBefore(newPoint); // 创建一条新的线。
28  }
29  // 把新取到的参数，放到数组的尾部，并位移最早的坐标值。
30  function  newLine(tem){    
31      str  =  '';
32       for (i = 1 ;i <= 20 ;i ++ ){
33       var  t1  =  art[i].split(',');
34      t1[ 0 ] =  t1[ 0 ]  -   10 ;
35      art[i - 1 ]  =  t1[ 0 ]  +  ','  +  t1[ 1 ];
36      str  =  str  +  art[i - 1 ];
37  }
38      art[ 20 ]  =   " 200, "   +  tem  +  ' ';
39      str  =  str  +  art[ 20 ];
40  }
41  </ script >
42  < script  type ='text/javascript'  src ='dwr/interface/SnmpUtil.js' ></ script >   
43  < script  type ='text/javascript'  src ='dwr/engine.js' ></ script >   
44  < script  type ='text/javascript'  src ='dwr/util.js' ></ script >
45 
46       < body >
47           < br >
48           < br >
49           <!--   坐标绘制   -->
50           < v:group  ID ="group1"  style ="WIDTH:500px;HEIGHT:200px"
51              coordsize ="200,200" >
52               <% for ( int  i = 0 ;i <= 20 ;i ++ ){  %>
53                   < </di

分享到：

Javamail 群发邮件 | 无刷新实时获得数据

• 2011-03-09 00:30
• 浏览 708
• 评论(1)
• 分类:Web前端
• 相关推荐

评论

1 楼 greatghoul 2011-03-16  

javaeye上咋还有这种格式的代码框？

发表评论

您还没有登录,请您登录后再发表评论