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

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

## 客户端得到通知的方式 ##

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

## Dwr介绍 ##

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

## Dwr运行原理 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMTcwMjMx_size_16_color_FFFFFF_t_70]

**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>
            
             <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
            
    
            <init-param>
                <param-name>debug</param-name>
                <param-value>true</param-value>
            </init-param>
            
            <init-param>
                <param-name>activeReverseAjaxEnabled</param-name>
                <param-value>true</param-value>
            </init-param>
            
            <init-param>
                <param-name>crossDomainSessionSecurity</param-name>
                <param-value>false</param-value>
            </init-param>
            
            <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>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMTcwMjMx_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/18/3d71835177564f9e8044380aff217222.png