DWR实现服务器推 简单demo

前端之家收集整理的这篇文章主要介绍了DWR实现服务器推 简单demo前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文目的:

利用开源DWR,实现客户端页面不用刷新就可以显示服务器发送过来的数据。这是一个jsp+tomcat+dwr的简单例子。具体的理论性知识参考dwr官网。

文章最后附带MyEclipse的源工程下载。


准备工作:

1、DWR官网下载3.0的jar包

地址: https://java.net/downloads/dwr/DWR_3.x/3.0_RC2/dwr.jar

2、在web工程中加入所依赖的文件

具体添加依赖文件的过程可以参考:DWR中文文档的第一章“DWR入门”,或者参考DWR官网Getting Started with DWR 中的配置。

依赖的文件有:刚才下载的dwr.jar包、Commons Logging jar


编辑配置文件

1、配置web.xml

将如下的代码添加到WEB-INF/web.xml,在web.xml中所有的<servlet>要放在一起,所有的<servlet-mapping>区域也是一样。关于web.xml的具体配置可以参考上述提供的文档。

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  3. <display-name>dwr_test</display-name>
  4. <welcome-file-list>
  5. <welcome-file>index.html</welcome-file>
  6. <welcome-file>index.htm</welcome-file>
  7. <welcome-file>index.jsp</welcome-file>
  8. <welcome-file>default.html</welcome-file>
  9. <welcome-file>default.htm</welcome-file>
  10. <welcome-file>default.jsp</welcome-file>
  11. </welcome-file-list>
  12. <listener>
  13. <listener-class>org.directwebremoting.servlet.DwrListener</listener-class>
  14. </listener>
  15. <servlet>
  16. <display-name>DWR Servlet</display-name>
  17. <servlet-name>dwr-invoker</servlet-name>
  18. <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
  19. <init-param>
  20. <param-name>debug</param-name>
  21. <param-value>true</param-value>
  22. </init-param>
  23. <!-- Remove this unless you want to use active reverse ajax -->
  24. <init-param>
  25. <param-name>activeReverseAjaxEnabled</param-name>
  26. <param-value>true</param-value>
  27. </init-param>
  28. <load-on-startup>1</load-on-startup>
  29. </servlet>
  30.  
  31. <!-- 下面是我在后文将要提到的一个servlet的设置,注意根据自己程序设置servlet-class和servlet-name区域的值 -->
  32. <servlet>
  33. <servlet-name>MySevlet</servlet-name>
  34. <servlet-class>dwr_test.MySevlet</servlet-class>
  35. </servlet>
  36.  
  37. <!-- 下面是我在后文将要提到的一个servlet的设置,注意根据自己程序设置url-pattern区域的值 -->
  38. <servlet-mapping>
  39. <servlet-name>MySevlet</servlet-name>
  40. <url-pattern>/server/push</url-pattern>
  41. </servlet-mapping>
  42.  
  43. <servlet-mapping>
  44. <servlet-name>dwr-invoker</servlet-name>
  45. <url-pattern>/dwr/*</url-pattern>
  46. </servlet-mapping>
  47.  
  48. </web-app>

2、配置dwr.xml

创建新的xml文件,命名为dwr。具体字段含义请参考上述给出的参考文档。

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
  3.  
  4. <!-- 要根据自己demo的实际情况具体设置如下的各个字段的值 -->
  5. <dwr>
  6. <allow>
  7. <create creator="new" javascript="service">
  8. <param name="class" value="dwr_test.Service" />
  9. </create>
  10. </allow>
  11. </dwr>

3、推送程序

  1. //Service.java
  2. package dwr_test;
  3.  
  4. /*public class Service {
  5. public String sayHello(String yourName) {
  6. return "Hello World " + yourName;
  7. }
  8. }*/
  9.  
  10.  
  11. import org.directwebremoting.Browser;
  12. import org.directwebremoting.ScriptSessions;
  13. import org.directwebremoting.ServerContextFactory;
  14. import org.directwebremoting.WebContext;
  15. import org.directwebremoting.WebContextFactory;
  16. import org.directwebremoting.ui.dwr.Util;
  17. import java.text.*;
  18. import java.util.*;
  19.  
  20. public class Service{
  21. public static void sendMsg(final String msg){
  22. //WebContext wctx = WebContextFactory.get();
  23. //Browser.withPage("/MyDWRSample/",new Runnable(){
  24. //针对具体的页面first_test.jsp页面进行推送
  25. String page = ServerContextFactory.get().getContextPath() + "/first_test.jsp";
  26. //System.out.println(page);
  27. Browser.withPage(page,new Runnable(){
  28. public void run(){
  29. //ScriptSessions.addFunctionCall("show",msg);
  30. //messageid字段是向jsp页面推送时所对应的字段,msg是要推送的消息
  31. Util.setValue("messageid",msg);
  32. }
  33. });
  34. }
  35.  
  36. }
这个程序包含的函数sendMsg负责向客户端推送消息。

4、模拟servlet,模拟请求服务

  1. //MyServlet.java,注意工程中这个文件的名字书写错误,好囧
  2. package dwr_test;
  3.  
  4. import java.io.IOException;
  5. import java.text.SimpleDateFormat;
  6. import java.util.Date;
  7.  
  8. import javax.servlet.ServletException;
  9. import javax.servlet.http.HttpServlet;
  10. import javax.servlet.http.HttpServletRequest;
  11. import javax.servlet.http.HttpServletResponse;
  12.  
  13. /*import org.directwebremoting.ServerContext;
  14. import org.directwebremoting.ServerContextFactory;
  15. import org.directwebremoting.WebContextFactory.WebContextBuilder;
  16. import org.directwebremoting.impl.DefaultWebContextBuilder;*/
  17.  
  18. public class MySevlet extends HttpServlet {
  19. private static final long serialVersionUID = 1L;
  20.  
  21. protected void doGet(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException {
  22. /* ServerContext sc = ServerContextFactory.get () ;
  23. WebContextBuilder webBuilder = new DefaultWebContextBuilder () ;
  24. webBuilder.engageThread (sc.getContainer (),request,response) ;*/
  25. doPost(request,response);
  26. }
  27.  
  28. protected void doPost(HttpServletRequest request,IOException {
  29. // PrintWriter out = response.getWriter();
  30. SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
  31. Service.sendMsg( "time: " + df.format(new Date()) + " aaaaaa");
  32. // out.write("aaaaa");
  33. }
  34. }
这个servlet用来模拟请求,当请求到来的时候,servlet调用sendMsg方法来向客户端推送当前时间以及字符串“aaaaaa”。

5、客户端页面first_test.jsp

这个页面用来接收服务器的推送。

  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
  2. pageEncoding="UTF-8"%>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  4. <html>
  5. <head>
  6. <Meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  7. <title>Insert title here</title>
  8.  
  9. <script type='text/javascript' src='/dwr_test/dwr/engine.js'></script>
  10. <script type='text/javascript' src='/dwr_test/dwr/util.js'></script>
  11. <script type='text/javascript' src='/dwr_test/dwr/interface/service.js'></script>
  12.  
  13. <script>
  14. function my_onload(){
  15. dwr.engine.setActiveReverseAjax(true);
  16. }
  17. function show(message){
  18. alert(message);
  19. document.getElementById('messageid').value=message;
  20. }
  21. </script>
  22.  
  23. </head>
  24. <body onload="my_onload();">
  25. 从服务端得到的消息:<br /> <input type="text" style="width:230px" id="messageid" value="" />
  26.  
  27. </body>
  28. </html>

程序演示:

输入链接http://localhost:8080/dwr_test/first_test.jsp,打开客户端页面


浏览器输入链接http://localhost:8080/dwr_test/server/push,模拟请求,这时客户端会显示当前时间以及字符串“aaaaaa":




MyEclipse工程下载:

http://download.csdn.net/detail/u013074465/9338055

本人刚刚接触web的东西,java也是刚开始学习,代码很劣质,希望指教。

参考

http://xiaoliang330.iteye.com/blog/1359874

http://www.yihaomen.com/article/java/551.htm

猜你在找的Ajax相关文章