DWR基本原理及其流程

前端之家收集整理的这篇文章主要介绍了DWR基本原理及其流程前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

最近公司的项目中用到dwr框架,出于好奇网上查了下相关资料。

摘要

今天简单学了一下DWR这个用于改善web页面与Java类交互的远程服务器端Ajax开源框架,下面对它该框架的基本原理及其运行流程做一下简单梳理。

目录:

  • 1、是什么?
  • 2、有什么?
  • 3、能干什么?
  • 4、怎么做?
  • 5、DWR运行原理:

    1、是什么?

    是一个框架。允许在Javascript中访问后台web服务器上的Java代码

    2、有什么?

    基于AJAX的框架,包含两个主要部分:一个运行在服务器端的Java Servlet,它处理请求并且向浏览器发回响应;运行在浏览器端的Javascript,它发送请求而且能动态更新网页。

    DWR的工作原理是通过动态把Java生成Javascript。它不需要任何网页浏览器插件就能运行在网页上。

    3、能干什么?

    让客户端Javascript通过DWR访问Java程序。

    4、怎么做?

    DWR没有开发环境只有运行环境。

    1)将DWR放入工程:

    1)引包:dwr.jar放在web应用的WEB-INF/lib目录下;

    2)将下载的dwr-版本号-src.zip/java/org/directwebremoting内的engine.jsutil.js放入web应用中对应的文件夹下,如js文件夹下。

    2)编辑配置文件

    1web.xml

    以下几行代码必须被添加WEN-INF/web.xml文件中。注意,要把<servlet>和其他<servlet>放在一起,<servlet-mapping>要和其他<servlet-mapping>放在一起

    <servlet>
        <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>
    </servlet>
     
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name> 
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>

    2dwr.xml

    web.xml的同一目录下,创建dwr.xml,并且将要调用java类写入其中。

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd">
    <dwr>
        <allow>
            <create creator=”new” javascript=”service”>
                <param name=”class” value=”全路径类”>
            </create>
        </allow>
    </dwr>

    3)再编写一个上面配置的“全路径类”;

    4)进行测试,在地址栏中输入:http://localhost:8080/工程名/dwr

    5)编写一个jsp页面

    引用几个dwrjsengine.jsutil.jsservice.js这些名称要与dwr.xml中配置的一样。

    <%@ page language="java" pageEncoding="UTF-8"%>
    <html>
        <head>
            <title>My JSP 'first_dwr.jsp' starting page</title>
            <script type='text/javascript' src='js/util.js'></script>
            <script type='text/javascript' src='js/engine.js'></script>
            <script type='text/javascript' src='dwr/interface/service.js'></script>
            <script type="text/javascript">
                function firstDwr(){
                    service.sayHello("Jorwen",callBackHello);
                }
     
                function callBackHello(data){
                    alert(data);
                }
            </script>
        </head>
        <body>
            <input type="button" name="button" value="测试" onclick="firstDwr()">
        </body>
    </html>

    5、DWR运行原理:

    1)部署阶段:

    1)读dwr.xml,在该xml文件中定义的Javascript(如名为service),它对应的类为如DWRTest,这里cc相当于DWRTest,通过反射生成cc.js,其中DWRTest中的方法也就是调用后台类的方法

    2)运行阶段:

    触发事件调用一个方法——>

    从自己的js调用了上面的cc.js中的方法t1——>

    调用客户端的AJAX引擎发出请求——>

    以上三步都是由客户端完成,后面的都是有服务器端来完成:

    Web容器先接到请求,找上下文路径:/dwr/匹配dwr中对应的servlet——>

    dwr.xml;根据js名匹配creator定义;依据creator方法创建实例(反射);调用方法,得到返回值——>

    out出去——>

    回调处理——>

    调用客户端的回调处理(自己写的方法)。

  • 猜你在找的Ajax相关文章