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
• 浏览 1627
• 评论(1)
• 分类:Web前端
• 查看更多

评论

1 楼 greatghoul 2011-03-16  

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