首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

Ajax技术统观(1)

2012-11-10 
Ajax技术概览(1)在编程的世界里,Ajax带来了超世代网站开发的复兴这一激动人心的时期,但是创建Web服务时,它

Ajax技术概览(1)

在编程的世界里,Ajax带来了超世代网站开发的复兴这一激动人心的时期,但是创建Web服务时,它同样也对在表达专家和应用开发人员建立新的“政教分离”构成威胁。

  由于一个面向服务的架构的目标是创建超世代的、面向用户业务的服务,在许多业务创新中这样的分离可能导致功亏一篑。为了在这个鸿沟形成之前就突破它,现在ClearNova公司发布了一个新的快速应用程序开发 (RAD)平台,它所使用的开源框架是把J2EE [Java 2企业版本(Java2 Enterprise Edition)]和Ajax结合起来的。

  这个平台称为ThinkCap JX,它将允许Java 程序员在服务器上进行对用户界面的修改,并且无需了解Ajax(Ajax是异步JavaScript和XML的缩写)的所有细节,这是因为在服务器上有一个以客户为中心的应用程序接口。同样,RAD将自动为在客户端完成的JavaScript编程生成Java stubs。

  “Ajax与Java的联系比你所认为的要更多,因为Java是非常多的Web应用和服务建立所使用的语言,” ClearNova公司的战略副总裁Steve Benfield说。“虽然Ajax是基于浏览器的技术,但是你将处于呼叫服务器状态的情况要比你所想象的多。”

  集成的并且协调的灵活性是SOA所需具备的关键条件之一。当进行业务修改时,Web服务需要接受这个修改,并且快速进行修改重新得到一个用户可用的服务。

  使Ajax功能如此强大的原因在于它使用浏览器技术来制作动态Web网页,而不需要在每次被鼠标点击的时候都刷新页面。然而JavaScript编程技能导致一般Java开发人员并不能普遍掌握动态表示。

  “问题是,你希望成为一个专制的JavaScrip程序员呢,还是希望成为一个仅仅接触一部分JavaScrip的Java开发人员呢?”Benfield提出疑问。

  在微软发布Atlas的试用版本一天之后,ClearNova公司也发布了他们的RAD,它是用于ASP.NET的Ajax实现工具。Burton Group 的分析师Richard Monson-Haefel说,他相信IT产业将要出现一个使用Ajax开发工具的浪潮,这是由于技术本身具备丰富用户经验的能力。

  “在我们如何与Web服务进行交互这一方面,Ajax正在扮演着越来越重要的角色,”他说。“Ajax正在从根本上改变我们使用Web的方式,并且开发人员不得不做出相应的改变以平衡这一变化。”

  Benfield预计在接下来的两年之内,表达方式这方面将会出现一个迅速转变以迫使形成集成的松散耦合的开发环境。

? 页面重载提出了一个在Web应用开发中最大的可用性障碍,对于java开发来说也是一个重大的挑战。在本系列中,作者Philip McCarthy介绍了通过后台通道的方法来创建动态Web应用的经验。Ajax(Asynchronous JavaScript and XML)是一个结合了Java技术、XML、以及JavaScript的编程技术,可以让你构建基于Java技术的Web应用,并打破了使用页面重载的惯例。

?????? Ajax,异步JavaScript与XML,是使用客户端脚本与Web服务器交换数据的Web应用开发方法。这样,Web页面不用打断交互流程进行重新加裁,就可以动态地更新。使用Ajax,你可以创建接近本地桌面应用的,直接的、高可用的、更丰富的、更动态的Web用户接口界面。

?????? Ajax不是一个技术,它更像是一个模式—标志并描述有用的设计技巧的一种方法。对于刚了解它的许多开发人员来说,它是一种新的感觉,但是实现Ajax的所有组件都已存在了许多年。当前的热闹是因为在2004与2005年出现了一些基于Ajax的非常动态的WebUI,尤其是Google的GMail与 Maps应用系统、与照片共享网站Flickr。这些UI充分地使用了后台通道,也被一些开发者称为“Web 2.0”,并导致了大家对Ajax应用兴趣的猛涨。

????? 在本系列中,我将给出所有你需要的开发你自己的Ajax应用的工具。在文章中,我将解释在Ajax背后的概念,示范为基于Web的应用系统创建一个 Ajax接口的基本步骤。我将使用示例代码来示范实现Ajax动态接口的服务器端Java代码与客户端JavaScript脚本。最后,我将指出一些 Ajax方法中易犯的错误,以及在创建Ajax应用时应该考虑的广泛范围内的可用性与易访问性方面的问题。

????? 一个更好的购物车

????? 你可以使用Ajax来加强传统的Web应用,通过消除页面载入来使交互更流畅。为了示范它,我将使用一个简单的,能动态更新加入的物品购物车。结合一个在线商店,这个方法可以不用等待点击后的页面重载,而让我们继续浏览并挑选物品到购物车中。虽然,本文中的代码针对购物车例子,但其中展示的技术可以用到其它的Ajax应用中。列表1中展示了购物车示例所使用的HTML代码。在整篇文章中,我都将会引用到这些HTML代码。

????? 列表1:购物车示例的相关代码片断

/** 通过产品编码,在购物车中添加一个条目* itemCode – 需要添加条目的产品编码*/function addToCart(itemCode) {  // 获取一个XMLHttpRequest实例  var req = newXMLHttpRequest();  // 设置用来从请求对象接收回调通知的句柄函数  var handlerFunction = getReadyStateHandler(req, updateCart);  req.onreadystatechange = handlerFunction;  // 打开一个联接到购物车servlet的HTTP POST联接  // 第三个参数表示请求是异步的  req.open("POST", "cart.do", true);  // 指示请求体包含form数据  req.setRequestHeader("Content-Type",                       "application/x-www-form-urlencoded");  // 发送标志需要添加到购物车中条目的form-encoded数据  req.send("action=add&item="+itemCode);}
?



????? 结合以上内容,你可以了解到Ajax处理过程的第一部分—就是在客户端创建并发送HTTP请求。下一步是用来处理请求的Java Servlet代码。


?

热点排行