效果。而且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>
<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>
<!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;
}
}
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>
<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>
沒有留言:
張貼留言