Dwr 框架简单实例
? ?Dwr 是一個 Java 開源庫,幫助你實現(xiàn)Ajax網(wǎng)站。
? ?它可以讓你在瀏覽器中的Javascript代碼調(diào)用Web服務(wù)器上的Java,就像在Java代碼就在瀏覽器中一樣。
? ?Dwr 主要包括兩部分:
? ?在服務(wù)器上運行的 Servlet 來處理請求并把結(jié)果返回瀏覽器。
? ?運行在瀏覽器上的 Javascript,可以發(fā)送請求,并動態(tài)改變頁面。
? ?Dwr 會根據(jù)你的 Java 類動態(tài)的生成Javascript代碼。
? ?這些代碼的魔力是讓你感覺整個Ajax調(diào)用都是在瀏覽器上發(fā)生的,但事實上是服務(wù)器執(zhí)行了這些代碼,DWR負(fù)責(zé)數(shù)據(jù)的傳遞和轉(zhuǎn)換。
?
? ?從DWR官網(wǎng)下載最新版本的jar包,地址:http://directwebremoting.org/dwr/downloads/index.html
? ?將jar包放入WEB-INF的lib文件夾下。同時,dwr依賴于commons-logging.jar這個包
? ?配置 web.xml 文件如下
<servlet><servlet-name>dwr-invoker</servlet-name><servlet-class>uk.ltd.getahead.dwr.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>
? ?配置 dwr 如下
<?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"><!-- 關(guān)鍵配置 --> <dwr><allow><create creator="new" javascript="Chat"><param name="class" value="com.epri.xts.wxqyh.app.chatroom.module.Chat"/></create><convert converter="bean" match="com.epri.xts.wxqyh.app.chatroom.bean.Message"/></allow> </dwr><!--<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN" "http://www.getahead.ltd.uk/dwr/dwr10.dtd"><!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd"> -->?
? ?dwr.xml 是 dwr 的核心配置文件,主要的標(biāo)簽有:<converter>、<convert>、<create>這三個標(biāo)簽。
? ?<create> 標(biāo)簽是 dwr 中重要的標(biāo)簽,用來描述 java(服務(wù)器端) 與 javascript (客戶端)的交互方式。其基本格式如下:
<allow><create creator="..." javascript="..." scope="..."><param name="..." value="..."/><auth method="..." role="..."/><exclude method="..."/><include method="..."/></create>... </allow>
其中,creator 和 javascript 是必須屬性,其他可以忽略。creator 包含有以下幾個值:
new:Java用“new”關(guān)鍵字創(chuàng)造對象
none:它不創(chuàng)建對象? (v1.1+)
scripted:通過BSF使用腳本語言創(chuàng)建對象,例如BeanShell或Groovy
spring:通過Spring框架訪問Bean
struts:使用Struts的FormBean? (v1.1+)
jsf:使用JSF的Bean? (v1.1+)
pageflow:訪問Weblogic或Beehive的PageFlow? (v1.1+)
ejb3:使用EJB3 session bean? (v2.0+)
這里初學(xué),實用java new創(chuàng)建對象。
4、頁面配置
? ?頁面需要引入3個JS
<script src="<%=ctxPath%>/dwr/interface/Chat.js" type="text/javascript"></script> <script src="<%=ctxPath%>/dwr/engine.js" type="text/javascript"></script> <script src="<%=ctxPath%>/dwr/util.js" type="text/javascript"></script>?
? ?其中 engine.js 必須要,如果需要用到dwr提供的一些方便的工具要引用util.js?,然后是dwr自動生成的js文件。
? ?名字和 dwr.xml 中 create 標(biāo)簽的 javascript 屬性值一樣,且必須是 dwr/interface 開頭的目錄
5、javascript代碼:
// 發(fā)送消息 function sendMessage() {var text = DWRUtil.getValue("message");if("" != text){DWRUtil.setValue("message", "");Chat.addMessage(text, name, taskId, gotMessages);} } function gotMessages(messages) {var chatlog = "";for ( var data in messages) {chatlog = "<div> <li class='even'>" + messages[data].text + "</li></div}DWRUtil.setValue("chatlog", chatlog);setTimeout("queryMessage()", 2000); }function queryMessage() {Chat.getMessages(taskId, gotMessages); }
html代碼
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%> <!DOCTYPE html> <%String ctxPath = request.getContextPath(); %> <html> <head> <title>聊天組</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="../css/jquery.mobile-1.4.5.min.css"> <link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css"> <link rel="stylesheet" href="../css/add.css"> <script src="../js/jquery-1.8.3.min.js"></script> <script src="../js/jquery.mobile-1.4.5.min.js"></script> </head> <body class="bgc" onload="queryMessage()"><div data-role="page" id="pageone"><!-- 聊天內(nèi)容顯示區(qū)域 --><div data-role="content" class="container" role="main"><ul class="content-reply-box mg10" id="chatlog"></ul></div><!-- 下方輸入框 --><div data-position="fixed" data-role="footer"><ul class="footer"><li class="col-xs-3"><span class="b_pic"><form action="<%=request.getContextPath()%>/chat" method="post"enctype="multipart/form-data" data-ajax="false" name="form"id="form" target="relnews"><input type="hidden" name="name" id="name" value="" /> <input type="hidden" name="taskId" id="taskId" value="" /> <input type="file" name="image" id="image" class="photo" onchange="sendImage(this)" /></form></span></li><li class="col-xs-6"><input type="text" name="fname" id="message"></li><li class="col-xs-4"><a href="" data-role="button"class="b_submit" id="submitInfo" onclick='sendMessage();'>發(fā)送</a></li></ul></div></div><!-- 隱藏域作為表單提交后頁面不跳轉(zhuǎn)使用 --><iframe align="center" frameborder="0" marginheight="0" marginwidth="0"name="relnews" id="hiddenIframe" scrolling="no"style="width: 100%; height: 100%; display: none"> </iframe></body> <script src="<%=ctxPath%>/dwr/interface/Chat.js" type="text/javascript"></script> <script src="<%=ctxPath%>/dwr/engine.js" type="text/javascript"></script> <script src="<%=ctxPath%>/dwr/util.js" type="text/javascript"></script> <script type="text/javascript" src="../js/chat.js"></script> </html>
6、其他
dwr可以設(shè)置是否采用異步方式訪問java代碼:
dwr.engine.setAsync(false); //false為同步,true(默認(rèn))為異步 以及dwr對于異常的處理,這里標(biāo)注一個簡單的全局異常,細(xì)分的后續(xù)學(xué)習(xí)補充:dwr.engine.setErrorHandler(errh); function errh(errorString, exception) {errorFlag = true;alert("操作失敗!"); }
?
轉(zhuǎn)載于:https://www.cnblogs.com/java-class/p/6653739.html
總結(jié)
以上是生活随笔為你收集整理的Dwr 框架简单实例的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 顺丰首重多少钱啊?
- 下一篇: 石家庄新火车站的停车场怎么收费的?需要停