2010年3月11日 星期四

Direct Web Remoting(DWR)简介

DWR可以在Web Application上直接处理XMLHttpRequest,因此你可以在 有的架构下利用DWR来产生Ajax的
效果。而且DWR非常简单,只要再web.xml加入DRW的Servlet并新增一个dwr.xml的设定档。就可以直接在Client端
利用Javascript直接唿叫Server端的Java方法。
以下建构一个简单的例子,在Client端输入一串字串,Servler端在收到这一个字串后,回传Client端输入的字串并回传
Server端目前系统时间。


1. 下载dwr.jar档。


2. 在web.xml加入DRW的Servlet。
<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>


3. 在WEB-INF下新增一个dwr.xml的设定档。
<?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="AjFuns">
            <param name="class" value="tw.nicky.dwr.AjaxFunctions"/>
       </create>
    </allow>
</dwr>



4. 建立AjaxFunctions.class(此类别就是用户端要唿叫的类别)
package tw.nicky.dwr;
import java.util.Date;
public class AjaxFunctions {
    public String getEchoTime(String msg) {
        String result = "";
        result = result + "your input: "+msg+" ";
        result = result + "server time: "+new Date();
        return result;
    }
}




5.最后建立呈现在用户端的网页()
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>dwr_example</title>
        <script type='text/javascript' src='dwr/interface/AjFuns.js'></script>
        <script type='text/javascript' src='dwr/engine.js'></script>
        <script type='text/javascript'>
            function getEchoTime(){
                var msg = document.getElementById("msg").value;
                AjFuns.getEchoTime(msg,function(ret){
                    document.getElementById("results").innerHTML = ret;
                });

            }
        </script>
    </head>
    <body>
        <input type="text" id="msg">
        <input type="button" value="确定" onClick="getEchoTime()">
        <div id="results">
        </div>
    </body>
</html>


沒有留言:

張貼留言