注册 | 登录 | 设为首页 | 加入收藏
您当前的位置:飞翔学院-IT中国 → 编程开发AJAX → 文章内容

结合Direct Web Remoting使用AJAX

作者:佚名 来源:不详 发布时间:2007-12-10 21:57:06
create 元素

  create 元素告诉 DWR 应当公开给 Ajax 请求的服务器端类,并定义 DWR 应当如何获得要进行远程的类的实例。这里的 creator 属性被设置为值 new,这意味着 DWR 应当调用类的默认构造函数来获得实例。其他的可能有:通过代码段用 Bean 脚本框架(Bean Scripting Framework,BSF)创建实例,或者通过与 IOC 容器 Spring 进行集成来获得实例。默认情况下,到 DWR 的 Ajax 请求会调用 creator,实例化的对象处于页面范围内,因此请求完成之后就不再可用。在无状态的 CatalogDAO 情况下,这样很好。

  create 的 javascript 属性指定从 JavaScript 代码访问对象时使用的名称。嵌套在 create 元素内的 param 元素指定 creator 要创建的 Java 类。最后,include 元素指定应当公开的方法的名称。显式地说明要公开的方法是避免偶然间允许访问有害功能的良好实践 —— 如果漏了这个元素,类的所有方法都会公开给远程调用。反过来,可以用 exclude 元素指定那些想防止被访问的方法。

  convert元素

  creator负责公开用于 Web 远程的类和类的方法,convertor 则负责这些方法的参数和返回类型。convert 元素的作用是告诉 DWR 在服务器端 Java 对象表示和序列化的 JavaScript 之间如何转换数据类型。

  DWR自动地在Java和JavaScript 表示之间调整简单数据类型。这些类型包括Java原生类型和它们各自的类表示,还有 String、Date、数组和集合类型。DWR 也能把 JavaBean 转换成 JavaScript 表示,但是出于安全性的原因,做这件事要求显式的配置。

  清单2中的 convert 元素告诉 DWR 用自己基于反射的 bean 转换器处理 CatalogDAO 的公开方法返回的 Item,并指定序列化中应当包含 Item 的哪个成员。成员的指定采用 JavaBean 命名规范,所以 DWR 会调用对应的 get 方法。在这个示例中,我去掉了数字的 price 字段,而是包含了 formattedPrice 字段,它采用货币格式进行显示。

  现在,我准备把 dwr.xml 部署到 Web 应用程序的 WEB-INF 目录,在那里 DWR servlet 会读取它。但是,在继续之前,确保每件事都按照希望的那样运行是个好主意。

  测试部署

  如果DWRServlet的web.xml定义把 init-param debug 设置为 true,那么就启用了 DWR 非常有帮助的测试模式。导航到 /{your-web-app}/dwr/ 会把 DWR 配置的要进行远程的类列表显示出来。在其中点击,会进入指定类的状态屏幕。CatalogDAO 的 DWR 测试页如图 2 所示。除了提供粘贴到 Web 页面的 script 标记(指向 DWR 为类生成的 JavaScript)之外,这个屏幕还提供了类的方法列表。这个列表包括从类的超类继承的方法,但是只有在 dwr.xml 中显式地指定为远程的才标记为可访问。

图 2. CatalogDAO 的 DWR 测试页
结合Direct Web Remoting使用AJAX(图二)

  可以在可访问的方法旁边的文本框中输入参数值并点击 Execute 按钮调用方法。服务器的响应将在警告框中用 JSON 标注显示出来,如果是简单值,就会内联在方法旁边直接显示。这个测试页非常有用。它们不仅允许检查公开了哪个类和方法用于远程,还可以测试每个方法是否像预期的那样工作。

  如果对远程方法的工作感到满意,就可以用 DWR 生成的 JavaScript 存根从客户端代码调用服务器端对象。

  调用远程对象

  远程 Java 对象方法和对应的 JavaScript 存根函数之间的映射很简单。通用的形式是 JavaScriptName.methodName(methodParams ..., callBack),其中 JavaScriptName 是 creator 的 javascript 属性指定的名称,methodParams 代表 Java 方法的 n 个参数,callback 是要用 Java 方法的返回值调用的 JavaScript 函数。如果熟悉 Ajax,可以看出这个回调机制是 XMLHttpRequest 异步性的常用方式。

  在示例场景中,我用清单 3 中的 JavaScript 函数执行搜索,并用搜索结果更新用户界面。这个清单还使用来自 DWR 的 util.js 的便捷函数。要特别说明的是名为 $() 的 JavaScript 函数,可以把它当作 document.getElementById() 的加速版。录入它当然更容易。如果您使用过 JavaScript 原型库,应当熟悉这个函数。

   清单 3. 从客户机调用远程的 findItems()
 /*  * Handles submission of the search form  */ function searchFormSubmitHandler() {   // Obtain the search expression from the search field   var searchexp = $("searchbox").value;   // Call remoted DAO method, and specify callback function   catalog.findItems(searchexp, displayItems);   // Return false to suppress form submission   return false; }         /*  * Displays a list of catalog items  */ function displayItems(items) {   // Remove the currently displayed search results   DWRUtil.removeAllRows("items");   if (items.length == 0) {     alert("No matching products found");     $("catalog").style.visibility = "hidden";   } else {     DWRUtil.addRows("items",items,cellFunctions);     $("catalog").style.visibility = "visible";   } }

  在上面的 searchFormSubmitHandler() 函数中,我们感兴趣的代码当然是 catalog.findItems(searchexp, displayItems);。这一行代码就是通过网络向 DWR servlet 发送 XMLHttpRequest 并用远程对象的响应调用 displayItems() 函数所需要的全部内容。

  displayItems() 回调本身是由一个 Item 数组表示调用的。这个数组传递给 DWRUtil.addRows() 便捷函数,同时还有要填充的表的 ID 和一个函数数组。表中每行有多少单元格,这个数组中就有多少个函数。按照顺序使用来自数组的 Item 逐个调用每个函数,并用返回的内容填充对应的单元格。

  在这个示例中,我想让商品表中的每一行都显示商品的名称、说明和价格,并在最后一列显示商品的 Add to Cart 按钮。清单 4 显示了实现这一功能的单元格函数数组:

   清单 4. 填充商品表的单元格函数数组
 /*  * Array of functions to populate a row of the items table  * using DWRUtil's addRows function  */ var cellFunctions = [   function(item) { return item.name; },   function(item) { return item.description; },   function(item) { return item.formattedPrice; },   function(item) {     var btn = document.createElement("button");     btn.innerHTML = "Add to cart";     btn.itemId = item.id;     btn.onclick = addToCartButtonHandler;     return btn;   } ]; 

  前三个函数只是返回 dwr.xml 中 Item 的 convertor 包含的字段内容。最后一个函数创建一个按钮,把 Item 的 ID 赋给它,并指定在点击按钮时应当调用名为 addToCartButtonHandler 的函数。这个函数是第二个用例的入口点:向购物车中添加 Item。
更多内容请看PCdog.com--Ajax技术专题
上一页  [1] [2] [3] [4]  下一页


  • 打印文档
  • 推荐好友
  • 返回顶部
  • 增大字体
  • 减少字体
关于本站 | 工作机会 | 合作网站 | 广告服务 | 市场合作| 联系我们 | 抽奖活动
版权所有: 武汉威俊科技有限公司 Copyright 2005-2007 www.ITCNW.COM All rights reserved