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

最新推荐文章于 2025-04-21 17:36:31 发布

_Shallow

最新推荐文章于 2025-04-21 17:36:31 发布

阅读量1.1k

点赞数

文章标签：推送消息 Dwr

本文链接：https://blog.youkuaiyun.com/qq_41170231/article/details/100679940

版权

本文详细介绍使用DWR框架实现客户端与服务器之间的实时双向通信。包括配置web.xml和dwr.xml，编写推送方法，以及前端页面如何触发推送并显示消息。DWR允许客户端通过JavaScript直接调用服务器端Java方法，实现高效的数据推送。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

客户端得到通知的方式

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

Dwr介绍

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

Dwr运行原理

在这里插入图片描述

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

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

最重要的四步：

配置web.xml
配置dwr.xml
编写push方法
前端页面触发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 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($("#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>