今天学习了下DWR,顺便落笔总结下今天所学的。若有不恰当之处,请多多指教。
DWR的简介:
简单的说,DWR就是用用浏览器的javascript代码来访问服务器上的代码。可以总结为两个部分:1.服务端的java servlet,负责请求并向浏览器返回响应。2.浏览器的javascript,负责发送请求和动态更新网页。
DWR工作原理:
DWR动态在javascript里生成一个AjaxService类,去匹配服务器端的代码。由evenHandler去调用它,然后DWR处理所有的远程细节,包括倒置(converting)所有的参数以及返回javascript和java的值。
DWR简单的例子:helloWorld
1.下载dwr.jar包。官网:点击打开链接。目前有最新版本3.0RC2,最好使用stable release(最终稳定释放)版本 2.0.10
2.将dwr.jar放在应用服务器lib下。
3.编写web.xml(本人使用的是j2ee3.0)
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" version="3.0"> <display-name>DWRTEST</display-name> <welcome-file-list> <welcome-file>index.html</welcome-file> <welcome-file>index.htm</welcome-file> <welcome-file>index.jsp</welcome-file> <welcome-file>default.html</welcome-file> <welcome-file>default.htm</welcome-file> <welcome-file>default.jsp</welcome-file> </welcome-file-list> <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> </web-app>
4.建dwr.xml文件。该文件解释:
<create creator="new" javascript="jsp动态生成的js的名称"> //js引用的是改名字,js调用的方法的类名也是这个名字。
<param name="class" value="包.类名" />
<?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="service"> <param name="class" value="helloWorld.Service" /> </create> </allow> </dwr>
5.编写java类Service。
package helloWorld; public class Service { public String sayHello(String yourName){ return "Hello Word "+yourName; } }
6.启动服务器(如tomcat,port:8080)http://locahost:8080/工程名/dwr.将会看到如下:
6.编写jsp。
在这儿要提重要的几点:
a.<script type="" src="/工程名/dwr/interface/(dwr.xml)new的名字(如上的service)"></script>
b.engin.js util.js 只要dwr.jar放在web服务下lib里,就这样写。其实可以在http://locahost:8080/工程名/dwr查看到,它里面是自动根据你的路径匹配的。
c. 下面代码中第一个DWRTest()方法是button按钮自定义的方法,然后触发的时间,该方法调用 service.sayHello()方法,并且调用方法sayHello的参数要比原来多一个,这个就是回调函数名(名字自己定义,如callBack等),这个毁掉函数主要作用就是讲服务端的结果(data)返回到客户端。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>My JSP 'first_dwr.jsp</title> <script type='text/javascript' src='/DWRTEST/dwr/interface/service.js'></script> <script type='text/javascript' src='/DWRTEST/dwr/engine.js'></script> <script type='text/javascript' src='/DWRTEST/dwr/util.js'></script> <script type="text/javascript"> function DWRTest(){ service.sayHello("2012",callBackHello); } function callBackHello(data){ alert(data); } </script> </head> <body> <input type="button" value="DWR测试" onClick="DWRTest()" /> </body> </html>
DWR HelloWorld例子的bug
如图:
该问题主要的原因:这是同源策略的问题,为了WEB环境的安全,在WEB脚本语言中不允许读取不同源的数据,同源包括相同协议,相同域名和相同端口三个条件。而Ajax的异步处理方式跳过了这个限制,为了安全限制,它设置为sameDomainAccess。关于同源策略,本人了解不深,有兴趣的话可以google。
这样我们可以再web.xml文件中加入
<init-param> <param-name>crossDomainSessionSecurity</param-name> <param-value>false</param-value> </init-param>
这样,就没问题了。