您的位置:首页 > 其它

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

2019-08-07 12:23 281 查看

客户端得到通过的方式

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

Dwr介绍

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

Dwr运行原理

scriptSession:每次访问服务器都会创建一个scriptSession

服务器端获取scriptSession的两种方式:

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

过程

最重要的四步:

  1. 配置web.xml
  2. 配置dwr.xml
  3. 编写push方法
  4. 前端页面触发push方法和回调函数显示推送消息
配置web.xml
<servlet>
<servlet-name>dwr</servlet-name>
<!-- version 2.x -->
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<!-- version 3.x * -->
<!--        <servlet-class>uk.ltd.getahead.dwr.DWEServlet</servlet-class>-->
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<!-- 使用服务器反转AJAX  -->
<init-param>
<param-name>activeReverseAjaxEnabled</param-name>
<param-value>true</param-value>
</init-param>
<!-- 是能够从其他域请求true:开启; false:关闭 -->
<init-param>
<param-name>crossDomainSessionSecurity</param-name>
<param-value>false</param-value>
</init-param>
<!-- 允许远程调用js -->
<init-param>
<param-name>allowScriptTagRemoting</param-name>
<param-value>true</param-value>
</init-param>

<load-on-startup>1</load-on-startup>
</servlet>

<servlet-mapping>
<servlet-name>dwr</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>

配置dwr.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
<dwr>
<allow>
<create creator="new" javascript="DwrPush">
<param name="class" value="utils.DwrPush"></param>
<!-- 这个标签可以写也可以不写,无所谓的-->
<include method="Send"/>
</create>
</allow>
</dwr>

push方法

public void push(String message){
System.out.println("send..."+message);
WebContext webContext = WebContextFactory.get();
Collection<ScriptSession> sessions = webContext.getAllScriptSessions();

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

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

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%  %>
<html>
<head>
<title>index</title>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/interface/DwrPush.js"></script>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>

<script>
$(document).ready(function(){
// alert('can get here!');
// 页面加载的时候进行反转的激活
dwr.engine.setActiveReverseAjax(true);

// 点击页面按钮的时候触发的方法
$("#button").click(function(){

// 此类即为根据java文件生成的js文件
var data = document.getElementById("msg").value;
alert(data);
DwrPush.send(data);
});
});

function callback(msg){
//alert('test!');
$("#ul").html($(
8000
"#ul").html()+"<br />"+msg);
}
</script>
</head>
<body>
<ul id="ul"></ul>

<input type="text" name="dwr" id="msg"><br>
<input type="button" id="button" value="测试" >
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: