dwr3.0推送框架的入门搭建及解答（最新）

最新推荐文章于 2022-05-19 00:16:00 发布

qq_378039880

最新推荐文章于 2022-05-19 00:16:00 发布

阅读量411

点赞数

CC 4.0 BY-SA版权

分类专栏： DWR推送框架

本文链接：https://blog.youkuaiyun.com/qq_35357001/article/details/73609032

DWR推送框架专栏收录该内容

2 篇文章

订阅专栏

本文介绍了DWR3.0，一个用于简化浏览器与Java交互的Ajax框架。在搭建过程中遇到错误，通过参考他人博客解决，并详细记录了从创建动态web项目、配置web.xml和dwr.xml，到编写Java方法和jsp页面的步骤。关键点在于js引用时无需包含项目名。

DWR说白了是一个用于改善web页面与Java类交互的远程服务器端Ajax开源框架，可以帮助开发人员开发包含AJAX技术的网站。它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数，就像它就在浏览器里一样。

最近看了慕课网的dwr框架的学习，然后按照上面讲的写了小demo测试下，但是发现错误出现的不少，于是又查找其他人写的demo教程，发现他们对这个讲解的也是不太清楚，造成了很大的困惑，一直找不到原因，然后在慕课网视频下面看到有人写的博客，就去看了下，博客地址：http://blog.youkuaiyun.com/Marksinoberg/article/details/55505423#reply

讲解的确实不错，但是按他讲的那样走，我的Java写成的代码，还是无法编译成js保存。

先写下创建demo的步骤吧：

1，先看下我的目录：

因为是小demo，就简单的搭建了下，我是用idea搭建的动态web项目。如果不清楚如何用idea搭建动态web项目的话，可以度娘一下。

2、在web.xml 里配置

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
         version="3.1">

    <listener>
        <listener-class>org.directwebremoting.servlet.DwrListener</listener-class>
    </listener>

    <servlet>
        <display-name>dwrTest</display-name>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>

        <!-- 允许远程调用js（这个可有可无）-->
        <!--<init-param>
            <param-name>allowScriptTagRemoting</param-name>
            <param-value>true</param-value>
        </init-param>-->

    </servlet>
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>
</web-app>

3、在web.xml同级目录下新建dwr.xml并且配置

<?xml version="1.0" encoding= "UTF-8"?>
<!DOCTYPE dwr PUBLIC
        "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN"
        "http://directwebremoting.org/dwr/dwr30.dtd">
<dwr>
    <allow>
        <!-- 注意，Javascript的类名无需和下面实现类的类名一致 -->
        <create creator="new" javascript="dwrTest">
            <!-- 具体在server端实现的类 -->
            <param name="class" value="utils.dushPlush"/>
        </create>
    </allow>
</dwr>

4、这些都写好后，就需要在Java类中写咱们的方法了，这里我用了上面博主的方法；

package utils;

import org.directwebremoting.ScriptBuffer;
import org.directwebremoting.ScriptSession;
import org.directwebremoting.WebContext;
import org.directwebremoting.WebContextFactory;
import org.directwebremoting.proxy.dwr.Util;

import java.util.Collection;

/**
 * Created by T430 on 2017/6/20.
 */
public class dushPlush {


    public void  Send(String msg){
       WebContext webContext = WebContextFactory.get();
       @SuppressWarnings("deprecation")
        Collection<ScriptSession> sessions = webContext.getAllScriptSessions();

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

       // System.out.println("get Message:" + msg);
       // return "hello: " + msg;

    }

}

5、在jsp页面写东西

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>cesa</title>
    <script type='text/javascript' src='dwr/util.js'></script>
    <script type='text/javascript' src='dwr/engine.js'></script>
    <script type='text/javascript' src='dwr/interface/dwrTest.js'></script>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
    <script>

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

            // 点击页面按钮的时候触发的方法
            $("#button").click(function(){
                // 此类即为根据java文件生成的js文件
                var data = document.getElementById("data").value;
                dwrTest.Send(data);
            });
        });



        //////////////////////////////////////用于后台调取的函数
        function callback(msg){
            //alert('test！');
            $("#ul").html($("#ul").html()+"<br />"+msg);
        }
    </script>
</head>
<body>
<ul id="ul">

</ul>

<br/>
<hr>
<input type="text" id="data" name='data' />    
<input type='button' id="button" value="publish">

</body>
</html>

注意：重点来了！！！

上面引用的那个博主里面讲的是js代码引用中如何引用的，我按照他说的那样：项目名/util.js这样搭了以后，运行tomcat在浏览器上打开后是不成功的，也就是说无法查看到，

这是上面博主的关于引用的说法，但是我又仔细的看了，然后测试这个链接后发现， 去掉项目名才能访问到

打开这个http://localhost:8089/dwr/test/index.html后发现，

通过这个图就能看到，在引用的时候，不用加项目名。

6：写好以后运行tomcat，就可以试下自己写的这个demo了。

文末：非常感谢上面提到的博主，她自己研究以后，又给我们写了这样的博客，我们才能一步步的走过错误的坑。