Dwr使用

1. DWR
1.1 DWR基礎
1.1.1 概念
1、 什麼是DWR?
Direct Web Remote,直接Web遠程。是一個Ajax的框架。
2、 作用
使用DWR,可以直接在html網頁中調用Java對象的方法(通過JS和Ajax)。
3、 基本原理
主要技術基礎是:AJAX+反射。
1) JS通過AJAX發出請求,目標地址爲“/dwr/*”,被DWRServlet(中央控制器)攔截到;
2) DWRServlet再根據請求地址中的對象名,和dwr.xml配置文件中的對象名相匹配,根據其類名用反射機制來創建對象並調用其目標方法;
3) DWR再將目標方法的返回值以響應的方式,通過AJAX發送到客戶端JS中的響應函數(自定義),響應函數再對返回值進行處理。
1.1.2 使用
使用DWR的步驟
1、 下載DWR的包。
Dwr.jar
2、 引用DWR
複製dwr.jar到你的web工程的WEB-INF/lib目錄下;
在你的Web.xml文件中添加一個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>false</param-value>
</init-param>
<init-param>
<param-name>logLevel</param-name>
<param-value>WARN</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
在WEB-INF目錄下創建dwr的配置文件(dwr.xml)
3、 創建普通Java類和方法
package com.zhoujisong.dwr.biz;
public class LoginBiz { public boolean login(String name,String pwd){
System.out.println("----------取得用戶名:"+name+"; 和密碼:"+pwd);
if("zuxia".equals(name) && "123".equals(pwd)){ return true;
}else{ return false;
}
}
}
4、 在web-inf目錄下,新建dwr.xml文件,內容如下:
<dwr>
<allow>
<create creator="new" javascript="LoginBiz" scope="application">
<param name="class"
value="com.zhoujisong.dwr.biz.LoginBiz" />
</create>
</allow>
</dwr>
5、 創建html文件
引用3個js文件(),並寫JS請求函數和響應函數
<script type="text/javascript" src="dwr/engine.js"> </script>
<script type="text/javascript" src="dwr/util.js"> </script>
<!-- 引用dwr 框架根據它的配置文件動態生成的js -->
<script type="text/javascript" src="dwr/interface/LoginBiz.js"></script>
<script type="text/javascript" language="javascript">
//請求函數
function login(){
var uname=document.getElementsByName("uname")[0].value;
var upass=document.getElementsByName("upass")[0].value;
alert(uname+"\n"+upass);
LoginBiz.login(uname,upass,loginResponse);//調用指定對象的指定方法
}
//響應函數
function loginResponse(msg){
alert(msg);
}
</script>
1.2 DWR高級
1.2.1 在JS和Java之間傳遞實體對象。
Entity:JSJAVA
Entity:JSJAVA
1.2.2 在JS和Java之間傳遞List對象。
List:JS<--JAVA
List:JS-->JAVA
1.2.3 在JS和Java之間傳遞Map對象。
Map:JS<--JAVA
Map:JS-->JAVA
1.3 DWR和SSH集成
1.3.1 引用SSH的包和Dwr的包
將SSH的包複製到WEB-INF/lib目錄下;
將dwr.jar複製到WEB-INF/lib目錄下;
1.3.2 Web.xml文件
<!-- 配置struts2的核心控制器 -->
<filter>
<filter-name>Struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>Struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<!-- 配置Struts2集成Spring -->
<listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/classes/applicationContext.xml</param-value>
</context-param>
<!-- Dwr的控制器 -->
<servlet>
<servlet-name>DwrServlet</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>DwrServlet</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
1.3.3 在WEB-INF/lib目錄下新建Dwr.xml文件,內容如下: <dwr>
<allow>
<create creator="spring" javascript="userBiz">
<param name="beanName" value="userBizImpl"/>
</create>
<convert converter="bean"
match="com.zjs.sshems.entity.Userinfo" />
</allow>
<signatures>
<![CDATA[
import com.zjs.sshems.entity.Userinfo;
]]>
</signatures>
</dwr>
1.3.4 Login.jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/interface/userBiz.js"></script>
<script type="text/javascript"> function login(){ var userName = DWRUtil.getValue("user.userName"); var userPwd = DWRUtil.getValue("user.userPwd"); alert(userName +";"+userPwd); userBiz.loginVerify(userName,userPwd,loginResponse); } function loginResponse(userInfo){ alert("取得業務方法的返回值:"+userInfo.userId + ";"+ userInfo.userName +";"+userInfo.userPwd); } </script>
</head>
<body>
<form action="userLogin!login" method="post" >
用戶名:<input type="text" name="user.userName"/><br/>
密碼:<input type="password" name="user.userPwd"/><br/>
<input type="submit" value="登錄"/>
<input type="button" value="通過Dwr訪問登陸方法" οnclick="login()"/>
</form>
${error }
</body>
</html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章