分享程式碼.....雖然網路上很多相關資料,不過我覺得不是很清楚
因為我花了很多時間去測試才了解(是資質的關係嗎一.一a)
用途:
前端程式(javascript)呼叫後端程式(java)
有了前端呼叫後端程式的橋樑,能做的事太多了!!
以我例子來說,此程式是用來在網頁某些連結、圖片、Flash計算user點閱率!!
順便感謝jforumnewer及andowson的指導....
步驟1...
下載
dwr.jar
下載
commons-logging-1.xxx.Jar(Logging元件)放到WEB-INF/lib
步驟2...在web.xml中加入DWRServlet…
<?xml version="1.0" encoding="ISO-8859-1"?>
<web-app xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"
version="2.4">
<display-name>ajaxDWR</display-name>
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
<init-param>
<description></description>
<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>
</web-app>
步驟3...撰寫dwr.xml,用來告訴DWRServlet呼叫後端程式
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
"http://www.getahead.ltd.uk/dwr/dwr10.dtd">
<dwr>
<allow>
<create creator="new" javascript="Counter">
<param name="class" value="Counter" />
</create>
</allow>
</dwr>
步驟4...撰寫後端程式Counter.java做計數動作
import java.util.*;
import java.io.*;
import org.w3c.dom.*;
import javax.xml.parsers.DocumentBuilder;
import javax.xml.parsers.DocumentBuilderFactory;
import java.net.*;
import java.sql.*;
import java.security.*;
import javax.net.ssl.*;
import java.util.*;
import java.util.zip.*;
import javax.mail.*;
import javax.mail.internet.*;
import javax.activation.*;
import com.gemmyplanet.dbbean.DBOperationBean;
public class Counter {
public void counter( Integer BANNERNO) {
//=====================================================
// 宣告參數
//=====================================================
Integer ADBANNERNO = null;
String SERVICEID = null;
String CHANNELID = "";
String ADBANNERTYPE = null;
String TARGETURL = null;
String CLICKDATETIME = null;
String CHECKSUM = null;
String IMAGEDB = "GP_NEW_DB";
Connection dbCon = null;
Statement stmt = null;
ResultSet rs = null;
//=====================================================
// 日期 14位
//=====================================================
String ft_t = "yyyyMMddHHmmss";
String ft = ft_t.substring(0, 14);
//=====================================================
// 資料庫連線 && 更新資料
//=====================================================
try {
DBOperationBean dbOprBean = new DBOperationBean();
dbOprBean.setDatasource("DS_GP_NEW_DB");
dbCon = dbOprBean.getConnection();
if ( dbCon != null && !dbCon.isClosed() ){
stmt = dbCon.createStatement();
rs = stmt.executeQuery("SELECT * FROM "+ IMAGEDB +".ADBANNERINFO WHERE ADBANNERNO="+ BANNERNO);
if( rs != null ) {
while( rs.next() ) {
stmt.executeUpdate("INSERT INTO "+IMAGEDB+".ADBANNERLOGINFO SET SERVICEID='"+rs.getString("SERVICEID")+"', ADBANNERTYPE='"+rs.getString("ADBANNERTYPE")+"', TARGETURL='"+rs.getString("TARGETURL")+"', CLICKDATETIME='"+util.DateUtil.formatString(new java.util.Date(), ft)+"'");
}
}
stmt.close();
dbCon.close();
}
} catch (Exception ex) {
try {
if ( dbCon != null && !dbCon.isClosed() ){
stmt.close();
dbCon.close();
}
} catch( Exception e ) {}
}
}
}
步驟5...將Counter.java編譯後的.class放置WEB-INF\classes
步驟6...撰寫前端呼叫後端page_counter.js
function counter(num) {
Counter.counter(num);
}
步驟7...撰寫網頁index.jsp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=BIG5">
<title>第一個DWR程式</title>
//========================================
//dwr/interface/Counter.js是由DWRServlet根據dwr.xml中的設定生成的
//engine.js負責客戶端伺服端溝通
//util.js是一些好用的JavaScript程式,可以讓您少寫很多JavaScript。
//page_counter.js呼叫後端.java檔
//========================================
<script type='text/javascript' src='dwr/interface/Counter.js'></script>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='page_counter.js'></script>
</head>
<script language="Javascript">
function test(num,url) {
counter(num);
location.href = url;
}
function test1(num) {
counter(21);
}
</script>
<body>
<table>
<tr>
<td>測試</td>
</tr>
</table>
<input type='button' value='測試' onclick="test(21,'http://www.yahoo.com.tw')">
</body>
</html>
在Counter.java部分,可以做你需要後端做的事...
修改完web.xml與dwr.xml記的要重開Tomcat
測試時所有檔案的path:
1.建立新目錄 ---> tomcat/webapps/test/
2.dwr.jar ---> tomcat/webapps/test/WEB-INF/lib/
3.web.xml ---> tomcat/webapps/test/WEB-INF/
4.dwr.xml ---> tomcat/webapps/test/WEB-INF/
5.Counter.java ---> tomcat/webapps/test/WEB-INF/classes/
6.page_counter.js ---> tomcat/webapps/test/
7.index.jsp ---> tomcat/webapps/test/