DWR实现服务器端向客户端推送消息

太过爱你忘了你带给我的痛 2024-04-18 17:07 140阅读 0赞

客户端得到通知的方式

  1. 定时刷新
    每个一段时间刷新一次页面
    优点:不需要服务器配置,只需在客户端配置即可
    缺点:不断的对服务器端发送请求,对服务器端压力太大
  2. Ajax轮询
    比定时刷新略好,不像定时刷新一样整个页面刷新,但是缺点也一样
  3. Comet长连接
    由客户端主动发送请求,建立一个长连接通道,服务器端可以向客户端推送消息
    优点:实时性好,性能也可以
    缺点:长期占用长连接的资源

Dwr介绍

  1. 基于Ajax的框架
  2. 动态把java类生成Javascript
  3. 让客户端Javascript通过Dwr访问Java程序

Dwr运行原理

在这里插入图片描述

scriptSession:每次访问服务器都会创建一个scriptSession
服务器端获取scriptSession的两种方式:

  1. //Dwr3.0:
  2. Collection<ScriptSession> sessions = Browser.getTargetSessions();
  3. //Dwr2.0:
  4. Collection pages = webContext.getScriptSessionByPage("xxx.jsp");

最重要的四步:

  1. 配置web.xml
  2. 配置dwr.xml
  3. 编写push方法
  4. 前端页面触发push方法和回调函数显示推送消息

配置web.xml

  1. <servlet>
  2. <servlet-name>dwr</servlet-name>
  3. <!-- version 2.x -->
  4. <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
  5. <!-- version 3.x * -->
  6. <!-- <servlet-class>uk.ltd.getahead.dwr.DWEServlet</servlet-class>-->
  7. <init-param>
  8. <param-name>debug</param-name>
  9. <param-value>true</param-value>
  10. </init-param>
  11. <!-- 使用服务器反转AJAX -->
  12. <init-param>
  13. <param-name>activeReverseAjaxEnabled</param-name>
  14. <param-value>true</param-value>
  15. </init-param>
  16. <!-- 是能够从其他域请求true:开启; false:关闭 -->
  17. <init-param>
  18. <param-name>crossDomainSessionSecurity</param-name>
  19. <param-value>false</param-value>
  20. </init-param>
  21. <!-- 允许远程调用js -->
  22. <init-param>
  23. <param-name>allowScriptTagRemoting</param-name>
  24. <param-value>true</param-value>
  25. </init-param>
  26. <load-on-startup>1</load-on-startup>
  27. </servlet>
  28. <servlet-mapping>
  29. <servlet-name>dwr</servlet-name>
  30. <url-pattern>/dwr/*</url-pattern> </servlet-mapping>

配置dwr.xml

  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. <dwr>
  4. <allow>
  5. <create creator="new" javascript="DwrPush">
  6. <param name="class" value="utils.DwrPush"></param>
  7. <!-- 这个标签可以写也可以不写,无所谓的-->
  8. <include method="Send"/>
  9. </create>
  10. </allow>
  11. </dwr>

push方法
public void push(String message){
System.out.println(“send…”+message);
WebContext webContext = WebContextFactory.get();
Collection sessions = webContext.getAllScriptSessions();

  1. // 构建发送所需的JS脚本
  2. ScriptBuffer scriptBuffer = new ScriptBuffer();
  3. // 调用客户端的js脚本函数
  4. scriptBuffer.appendScript("callback(");
  5. // 这个msg可以被过滤处理一下,或者做其他的处理操作。这视需求而定。
  6. scriptBuffer.appendData(message);
  7. scriptBuffer.appendScript(")");
  8. // 为所有的用户服务
  9. @SuppressWarnings("deprecation")
  10. Util util = new Util(sessions);
  11. util.addScript(scriptBuffer);
  12. }

前端页面触发push方法和回调函数显示推送消息

  1. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
  2. <html>
  3. <head>
  4. <title>index</title>
  5. <script type="text/javascript" src="dwr/engine.js"></script>
  6. <script type="text/javascript" src="dwr/util.js"></script>
  7. <script type="text/javascript" src="dwr/interface/DwrPush.js"></script>
  8. <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
  9. <script>
  10. $(document).ready(function(){
  11. // alert('can get here!');
  12. // 页面加载的时候进行反转的激活
  13. dwr.engine.setActiveReverseAjax(true);
  14. // 点击页面按钮的时候触发的方法
  15. $("#button").click(function(){
  16. // 此类即为根据java文件生成的js文件
  17. var data = document.getElementById("msg").value;
  18. alert(data);
  19. DwrPush.send(data);
  20. });
  21. });
  22. function callback(msg){
  23. //alert('test!');
  24. $("#ul").html($("#ul").html()+"<br />"+msg);
  25. }
  26. </script>
  27. </head>
  28. <body>
  29. <ul id="ul"></ul>
  30. <input type="text" name="dwr" id="msg"><br>
  31. <input type="button" id="button" value="测试" >
  32. </body>
  33. </html>

发表评论

表情:
评论列表 (有 0 条评论,140人围观)

还没有评论,来说两句吧...

相关阅读