自己写的一个反向Ajax的Demo,在此记下笔记

liushengit

浏览: 36493 次
性别:
来自: 石家庄

最近访客更多访客>>

simple_hui

sutongxuevip

jyykfs

tianxin_008883

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

今天无意间看到了一篇关于dwr的文章，讲的是反向Ajax，想了想半年前一个项目的功能需求如果用它实现就太完美了。
项目要求是：数据库中A表中如果有了新的数据，系统的管理界面上要实时的显示出来，提醒给操作人员（是某种报警信息，好像特别重要）。

当时的实现方法是：让一Iframe里的页面每隔多少秒就刷新一次，来监视数据库A表的变化。这样客户端不断地向服务发送请求，服务器被动的返回客户端想要的数据。

反向Ajax技术是服务器向客户端主动的发关数据，很大的减少了服务的负担。
学习新的知识点就要多写些自己的Demo，在这里写一个最简单的例子，以作笔记：

sendMsg.jsp负责向表中添加数据(更新数据库)，showMsg.jsp用来实时显示前者添加的信息。
dwr.xml

<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr//dwr30.dtd">
<dwr>
	<allow>
		<create creator="new" javascript="SendMsg" scope="session">
			<param name="class" value="com.dwr.bean.SendMsg" />
		</create>
	</allow>	
</dwr>

SendMsg.java

package com.dwr.bean;
 
import java.util.Collection;
import java.util.LinkedList;

import org.directwebremoting.WebContext;
import org.directwebremoting.WebContextFactory;
import org.directwebremoting.proxy.dwr.Util;
/**  
 * DWR反向Ajax示例  
 * @author ︶ㄣ旺  http://syw.35free.net
 * @version 1.0  
 * */  
public class SendMsg    
{   
    public static WebContext wctx = null;  
    
    //用一个List代表数据库 来储存消息
    private LinkedList list = new LinkedList();
    
    //调用添加和显示方法   
    public void sendMsg(String msg)   
    {   
    	
    	list.addFirst(msg);
    	//最多保留10条聊天记录
    	if(list.size()>10){
    		list.removeLast();
    	}        	
    	
    	wctx = WebContextFactory.get();   
        Util utilThis = new Util(wctx.getScriptSession());   
        
        //使用utilThis重置 Id 属性为 msg 的文本框的内容
        utilThis.setValue("msg", "请输入信息"); 
        
        String currentPage = "/login/chat1.jsp"; //要推信息的页面地址  
        
        //获得所有已经打开此页面的会话
        Collection sessions = wctx.getScriptSessionsByPage(currentPage);   
        Util utilAll = new Util(sessions);
        
        //将消息从LinkedList中取出来，放放到一个字符串数组中
        //在这里遇到一个问题，就是直接用String[] msgs = (String[])list.toArray();时，报类型转换错误
        //但如下，给toArray()方法传递一个空的数组就不报错了，求解中....
        String[] msgs = new String[list.size()];
        msgs = (String[]) list.toArray(msgs);
        //先清空页面的消息内容，去除ul元素下所有元素
        utilAll.removeAllOptions("ul");        
        //向页面添加消息内容
        utilAll.addOptions("ul", msgs);
    }   
}

sendMsg.jsp

<%@ page language="java" pageEncoding="UTF-8"%> 
<%@ page isELIgnored="false" %>  
<html>   
  <head>   
    <title>DWR反向Ajax示例</title>   
    <meta http-equiv="pragma" content="no-cache">   
    <meta http-equiv="cache-control" content="no-cache">   
   	<script type='text/javascript' src='${pageContext.request.contextPath}/dwr/interface/SendMsg.js'></script>   
    <script type='text/javascript' src='${pageContext.request.contextPath}/dwr/engine.js'></script>   
    <script type='text/javascript' src='${pageContext.request.contextPath}/dwr/util.js'></script>  
    <script type="text/javascript">   
        function sendMessage()   
        {   
            var msg = $("msg").value;           
            SendMsg.sendMsg(msg); 
        }   
    </script>   
  </head>   
  <body>    
  DWR反向Ajax示例信息添加<br>   
        输入信息:<input  type="text" id="msg" name="msg" onkeypress="dwr.util.onReturn(event,sendMessage)">
  </body>   
</html>

showMsg.jsp

<%@ page language="java" pageEncoding="UTF-8"%>   
<%@ page isELIgnored="false" %>
<html>   
  <head>   
    <title>DWR反向Ajax示例</title>   
    <meta http-equiv="pragma" content="no-cache">   
    <meta http-equiv="cache-control" content="no-cache">   
    <script type='text/javascript' src='${pageContext.request.contextPath}/dwr/engine.js'></script>   
    <script type='text/javascript' src='${pageContext.request.contextPath}/dwr/util.js'></script>   
    
  </head>   
  <body onload="dwr.engine.setActiveReverseAjax(true);">    
  DWR反向Ajax示例信息显示<br>   
     ul:
     <ul id="ul">
     
     </ul>   
  </body>  
 
</html>

运行效果如图：

这时showMsg.jsp一直处于失去焦点状态，却能实时地显示服务器端更新的数据