论文部分内容阅读
摘 要：AJAX是ｗeb2.0应用的一种新方法。它并不是一门新的语言或技术，而是几种已经在各自领域大行其道的技术的强强结合，AJAX 混合了DHTML/CSS、DOM、 XML 及 XSLT等几项技术，并且利用 JavaScript来整合上述技术。ＡJAX为交互较多、频繁读数据、数据分类良好的web应用提供了一个很好的解决方案。
关键词：AJAX；XMLHttpRequest；Web应用
中图分类号：TP274 文献标识码：A
The Research and Practice of AJAX To Web 2.0Appliation
ZENG Wen-quan , ZENG Qing-bin
（School of Computer Engineering & Technology, GuangDong Institute of Science & Technology, Guangdong Guangzhou 510640)
Key words: AJAX；XMLHttpRequest；Web application
传统的J2EE表示层开发主要是指利用J SP和Servlet技术结合而构成的HTTP模型。这一编程模型的核心就是基于HTTP标准的表单提交,传统的表单完全由HTML标签构成,一旦用户进行提交,浏览器将把完整的表单信息发送至服务器,并等待Web 服务器返回完整的页面信息；对服务器而言,会带来严重的负载问题,经常需要发送重复的信息,以页面为单位的请求响应模式会严重降低Web表示层反应的灵敏性。
基于XML的异步JavaScript，简称AJAX（Asynchronous JavaScript and XML），该技术的引入,使得Web 表示层灵敏不足的现状大有改观。在AJAX之前,Web站点强制用户进入提交/等待/重新显示范例,用户的动作总是与服务器的“思考时间”同步。AJAX技术能够提供与服务器异步通信的能力,从而使用户从请求/响应的循环模式中解脱出来,通过借助AJAX,用户可以在单击按钮时,采用JavaScript和DHTML立即更新UI,并向服务器发出异步请求,以执行更新或查询数据库。当请求返回时,使用JavaScript和CSS来相应地更新UI,而不是刷新整个页面。对于终端而言,用户甚至不知道浏览器正在与服务器通信：Web站点看起来是即时响应的。
AJAX这个术语源自描述从基于网页的Web应用到基于数据的应用的转换。在基于数据的应用中，用户需求的数据可以从独立于实际网页的服务端取得并且可以被动态地写入网页中，给缓慢的Web应用体验着色，使得古老的B/S方式的Web开发焕发了新的活力。
1 AJAX应用程序与传统WEB应用程序之对比
AJAX是传统WEB应用程序的一个转变。以前是服务器每次生成HTML页面返回给客户端浏览器,而AJAX可以作为客户端和服务器之间的中间层，来处理客户端的请求，并根据需要向服务器端发送请求，同时更新页面时不用重载全部内容，只更新需要更新的那部分即可，这样就减少了数据下载总量。相对于纯后台处理并重载的方式缩短了用户等待时间，也把对资源的浪费降到最低。AJAX基于标准化的并被广泛支持和技术，并且不需要插件或下载小程序，所以对于用户和ISP(Internet Service Provider)来说是双赢的。
图1-1和图1-2分别显示了典型的web应用程序的生命周期和AJAX应用程序的生命周期。图1-3和图1-4分别显示了典型的web应用程序的模型和AJAX应用程序的模型。
综上所述，Ajax应用与传统的Web应用的区别主要在3个地方：
不刷新整个页面，在页面内与服务器通信。
使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。
应用仅由少量页面组成。大部分交互在页面之内完成，不需要切换整个页面。
Ajax就是Web标准和Web应用的可用性理论的集大成者。它极大地改善了Web应用的可用性和用户的交互体验，带来了更高的智能，使得Web应用更加动态，这样一类新型的Web应用叫做RIA（Rich Internet Application）应用。所以可以说，Ajax就是用户和市场的选择。
2 AJAX原理与技术介绍
AJAX并不是一门新的语言或技术,它实际上是几项技术按一定的方式组合在一起工作[1],它包括:
(1)使用DHTML和CSS（Cascading Style Sheets）标准化呈现；为了正确的浏览AJAX应用，CSS是一种AJAX开发人员所需要的重要武器。CSS提供了从内容中分离应用样式和设计的机制。虽然CSS在AJAX应用中扮演至关重要的角色，但他也是构建创建跨浏览器应用的一大阻碍，因为不同的浏览器厂商支持各种不同的CSS级别。
(2)使用DOM（Document Object Model）实现动态显示和交互；DOM是给 HTML 和 XML 文件使用的一组 API。它提供了文件的结构表述，让你可以改变其中的內容及可见物。其本质是建立网页与 Script 或程序语言沟通的桥梁。
(3)使用XML(Extensible Markup Language)和XSLT（eXtensible Stylesheet Language Transformation）或者文本等其他格式进行数据交换与处理；可扩展的标记语言XML具有一种开放的、可扩展的、可自描述的语言结构，他使对某些结构化数据的定义更加容易，并且可以通过他和其他应用程序交换数据。XSLT是最简单而快速的从XML数据生成HTML或XML的方式，可以被用在客户端和服务端，他能够减少大量的用JavaScript编写的应用逻辑。
(4)使用XMLHttpRequest进行异步数据读取; XMLHttpRequest对象用来响应通过HTTP传递的数据，一旦数据返回到客户端就可以立刻使用DOM将数据放到网页上，但并不会打断用户当前的操作。
(5)最后用JavaScript绑定和处理所有数据; 如名字所示AJAX的概念中最重要而最被忽视的是他也是一种JavaScript编程语言。JavaScript是一种粘合剂使AJAX应用的各部分集成在一起。在AJAX中JavaScript主要被用来传递用户界面上的数据到服务端并返回结果。
图2-1显示了在典型的网页异步通信中事件的发生顺序。
AJAX的工作原理相当于在用户和服务器之间加了-个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像-些数据验证和数据处理等都交给Ajax引擎自己来做,只有确定需要从服务器读取新数据时再由AJAX引擎代为向服务器提交请求。同时，与客户端不同，在服务端AJAX应用还是使用建立在如Java，.Net和PHP语言基础上机制，并没有改变这个领域中的主要方式。
3 AJAX的MVC架构设计
在WEB应用中，因为浏览器/服务器固有的这种请求/响应的断开式网络通讯模式，决定了在Model层无法实现主动向View层发出数据更新事件，所以一般常见的成熟MVC框架中都将经典MVC理论稍作修改：由Model层处理完业务后通知Control层，然后由Control层承担向View发送数据更新的义务。但是AJAX天生具有监听功能，AJAX实现异步响应的OnReadyStateChange事件就具有在客户端程序中才会有的事件监听功能。利用AJAX实现的MVC模型如图3-1所示：
理想化的AJAX的MVC设计有三层交互，假设对应的文件对象为：view.jsp(视图)、action.do(控制器)、model.java(模型)，那么其基本流程可以总结为以下步骤：
(1)view.jsp是用户看到的界面，并通过内置的AJAX对象以异步方式给action.do发送请求，然后OnReadyStateChange开始监听事件的状态；
(2)action.do接收到view.jsp发过来的请求，通过Request判断后发送给相应的业务/数据模型model.java；
(3)model.java开始执行业务操作，执行完毕直接给view.jsp页面发送数据更新的通知，这个通知的消息有可能是XML封装的数据，也有可能是一段文本，甚至是一段HTML代码。view.jsp页面中AJAX对象的OnReadyStateChange接收到了数据更新通知，并根据实际情况用DOM进行页面呈现更新。
4 AJAX的安全问题
(1)首先是恶意的用户可能会发送脏数据，尤其是创建攻击性的客户端。AJAX降低了服务器通讯中的用户交互。由于服务器通讯对于用户已经完全不可见，因此，你可以在用户不差觉得情况下传送数据。
(2)AJAX通过使用与Web服务互操作的更具有交互性的页面，AJAX增加了XML、文本和HTML的网络通信量。依赖XML作为请求/相应的内容类型，负载成为了Web服务的弱点。想象一个网页同时有1000个使用者。他们的服务器能够在这样的负荷下处理以正常形式进入的数据。他们一起在客户端或者服务器身上没有做存储而直接进入数据库得到数据的控制。现在我们1000个人将这样的请求重复十次。那这个服务器将达到10倍于以往的运算。如果服务器不能够处理它,他们可能会漏掉或者根本就完全停止了。
(3)考虑下面的OnReadyStateChange JavaScript语句，运行它是为了响应一个XMLHttpRequest:
xmlReq.onreadystatechange ={
if( xmlReq.readyState ＝＝ 4 )
eval( xmlReq.responseText );
}
上面的代码执行包含在来自于XMLHttpRequest的响应中的JavaScript代码。换句话说,有可能出现这种情况:即使一个页面加载完毕，也有可能在后台再进行添加或修改JavaScript函数和代码。因此就算你观察该页面代码的源代码-它可能发送了键击或鼠标移动事件到Web服务器,你也无法确信你所见的代码是当前执行的唯一代码。把这些特征与一些令人胆战心惊的困惑结合起来，那么你可以看到，恶意目的与XMLHttpRequest对象相结合，怎么不能实现Web客户的信息窃取。
因此，Eric Pascarello为AJAX安全性所提出的经验法则[2]：
(1)如果你使用身份验证,确定你在请求页上检查。
(2)为SQL注入检查。
(3)为JavaScript注入检查。
(4)保留商务逻辑在服务器上。
(5)不要假设每个请求是真正的。
(6)确认检查数据。
(7)审查请求的数据而且确定它是正确的。
5AJAX的缺陷
AJAX不是完美的技术,使用AJAX,必然要考虑他的一些不足:AJAX大量使用了JavaScript和AJAX引擎,而这个取决于浏览器的支持。IE510及以上版本,Mozilla110,NetScape7及以上版本才支持,Mozilla虽然也支持AJAX,但是提供XML HttpRequest 的方式不一样。所以使用AJAX的程序必须进行针对各个浏览器的兼容性测试。AJAX更新页面内容的时候并没有刷新整个页面,因此,网页的后退功能是失效的;有的用户还经常搞不清楚现在的数据是旧的还是已经更新过的。这个就需要在明显位置提醒用户“数据已更新”。对流媒体的支持没有Flash,J ava Applet好。一些手持设备(如手机、PDA等)现在还不能很好地支持AJAX。
6 AJAX应用与展望
AJAX理念的出现，揭开了无刷新更新页面时代的序幕，并有代替传统web开发中采用form递交方式更新web页面的趋势，可以算是一个里程碑。但AJAX都不是适用于所有地方的，它的适用范围是由它的特性所决定的。AJAX适用于交互较多、频繁读数据、数据分类良好的WEB应用。
目前AJAX已经成为了Web应用中增强用户体验的主流开发技术，大量的业界巨头对AJAX的支持与大力推动，加上大量开源的Javascript组件库和AJAX框架的出现，我们完全有理由相信AJAX的光明前景。
参考文献：
[1]Ryan Asleson ,Nathaniel T Schutta. Foundations of Ajax.Apress L . P. 2005.
[2]Jesse James Garrett. Ajax: A New Approach to Web Applications[EB/OL], http://www.adaptivepath.com/publications/essays/archives/000385.php .
[3]Dave Crane ,Eric Pascarello. Ajax in Action[M]. Manning Publications,2006 .
[4]Rohit Khare. Beyond AJAX:Accelerating Web Applications with Real Time Event Notification. August 2005.
[5]ohn MacKenzie ,Andrew McAlister ,Sahil Desai ,et al . Usa2bility in Web Design. 2005（10）.
[6]David Teare. Ajax 简介. http :/ / dev2dev. bea. com. cn/techdoc/ 2005110103. html. 2005（1）.
关键词：AJAX；XMLHttpRequest；Web应用
中图分类号：TP274 文献标识码：A
The Research and Practice of AJAX To Web 2.0Appliation
ZENG Wen-quan , ZENG Qing-bin
（School of Computer Engineering & Technology, GuangDong Institute of Science & Technology, Guangdong Guangzhou 510640)
Key words: AJAX；XMLHttpRequest；Web application
传统的J2EE表示层开发主要是指利用J SP和Servlet技术结合而构成的HTTP模型。这一编程模型的核心就是基于HTTP标准的表单提交,传统的表单完全由HTML标签构成,一旦用户进行提交,浏览器将把完整的表单信息发送至服务器,并等待Web 服务器返回完整的页面信息；对服务器而言,会带来严重的负载问题,经常需要发送重复的信息,以页面为单位的请求响应模式会严重降低Web表示层反应的灵敏性。
基于XML的异步JavaScript，简称AJAX（Asynchronous JavaScript and XML），该技术的引入,使得Web 表示层灵敏不足的现状大有改观。在AJAX之前,Web站点强制用户进入提交/等待/重新显示范例,用户的动作总是与服务器的“思考时间”同步。AJAX技术能够提供与服务器异步通信的能力,从而使用户从请求/响应的循环模式中解脱出来,通过借助AJAX,用户可以在单击按钮时,采用JavaScript和DHTML立即更新UI,并向服务器发出异步请求,以执行更新或查询数据库。当请求返回时,使用JavaScript和CSS来相应地更新UI,而不是刷新整个页面。对于终端而言,用户甚至不知道浏览器正在与服务器通信：Web站点看起来是即时响应的。
AJAX这个术语源自描述从基于网页的Web应用到基于数据的应用的转换。在基于数据的应用中，用户需求的数据可以从独立于实际网页的服务端取得并且可以被动态地写入网页中，给缓慢的Web应用体验着色，使得古老的B/S方式的Web开发焕发了新的活力。
1 AJAX应用程序与传统WEB应用程序之对比
AJAX是传统WEB应用程序的一个转变。以前是服务器每次生成HTML页面返回给客户端浏览器,而AJAX可以作为客户端和服务器之间的中间层，来处理客户端的请求，并根据需要向服务器端发送请求，同时更新页面时不用重载全部内容，只更新需要更新的那部分即可，这样就减少了数据下载总量。相对于纯后台处理并重载的方式缩短了用户等待时间，也把对资源的浪费降到最低。AJAX基于标准化的并被广泛支持和技术，并且不需要插件或下载小程序，所以对于用户和ISP(Internet Service Provider)来说是双赢的。
图1-1和图1-2分别显示了典型的web应用程序的生命周期和AJAX应用程序的生命周期。图1-3和图1-4分别显示了典型的web应用程序的模型和AJAX应用程序的模型。
综上所述，Ajax应用与传统的Web应用的区别主要在3个地方：
不刷新整个页面，在页面内与服务器通信。
使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。
应用仅由少量页面组成。大部分交互在页面之内完成，不需要切换整个页面。
Ajax就是Web标准和Web应用的可用性理论的集大成者。它极大地改善了Web应用的可用性和用户的交互体验，带来了更高的智能，使得Web应用更加动态，这样一类新型的Web应用叫做RIA（Rich Internet Application）应用。所以可以说，Ajax就是用户和市场的选择。
2 AJAX原理与技术介绍
AJAX并不是一门新的语言或技术,它实际上是几项技术按一定的方式组合在一起工作[1],它包括:
(1)使用DHTML和CSS（Cascading Style Sheets）标准化呈现；为了正确的浏览AJAX应用，CSS是一种AJAX开发人员所需要的重要武器。CSS提供了从内容中分离应用样式和设计的机制。虽然CSS在AJAX应用中扮演至关重要的角色，但他也是构建创建跨浏览器应用的一大阻碍，因为不同的浏览器厂商支持各种不同的CSS级别。
(2)使用DOM（Document Object Model）实现动态显示和交互；DOM是给 HTML 和 XML 文件使用的一组 API。它提供了文件的结构表述，让你可以改变其中的內容及可见物。其本质是建立网页与 Script 或程序语言沟通的桥梁。
(3)使用XML(Extensible Markup Language)和XSLT（eXtensible Stylesheet Language Transformation）或者文本等其他格式进行数据交换与处理；可扩展的标记语言XML具有一种开放的、可扩展的、可自描述的语言结构，他使对某些结构化数据的定义更加容易，并且可以通过他和其他应用程序交换数据。XSLT是最简单而快速的从XML数据生成HTML或XML的方式，可以被用在客户端和服务端，他能够减少大量的用JavaScript编写的应用逻辑。
(4)使用XMLHttpRequest进行异步数据读取; XMLHttpRequest对象用来响应通过HTTP传递的数据，一旦数据返回到客户端就可以立刻使用DOM将数据放到网页上，但并不会打断用户当前的操作。
(5)最后用JavaScript绑定和处理所有数据; 如名字所示AJAX的概念中最重要而最被忽视的是他也是一种JavaScript编程语言。JavaScript是一种粘合剂使AJAX应用的各部分集成在一起。在AJAX中JavaScript主要被用来传递用户界面上的数据到服务端并返回结果。
图2-1显示了在典型的网页异步通信中事件的发生顺序。
AJAX的工作原理相当于在用户和服务器之间加了-个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像-些数据验证和数据处理等都交给Ajax引擎自己来做,只有确定需要从服务器读取新数据时再由AJAX引擎代为向服务器提交请求。同时，与客户端不同，在服务端AJAX应用还是使用建立在如Java，.Net和PHP语言基础上机制，并没有改变这个领域中的主要方式。
3 AJAX的MVC架构设计
在WEB应用中，因为浏览器/服务器固有的这种请求/响应的断开式网络通讯模式，决定了在Model层无法实现主动向View层发出数据更新事件，所以一般常见的成熟MVC框架中都将经典MVC理论稍作修改：由Model层处理完业务后通知Control层，然后由Control层承担向View发送数据更新的义务。但是AJAX天生具有监听功能，AJAX实现异步响应的OnReadyStateChange事件就具有在客户端程序中才会有的事件监听功能。利用AJAX实现的MVC模型如图3-1所示：
理想化的AJAX的MVC设计有三层交互，假设对应的文件对象为：view.jsp(视图)、action.do(控制器)、model.java(模型)，那么其基本流程可以总结为以下步骤：
(1)view.jsp是用户看到的界面，并通过内置的AJAX对象以异步方式给action.do发送请求，然后OnReadyStateChange开始监听事件的状态；
(2)action.do接收到view.jsp发过来的请求，通过Request判断后发送给相应的业务/数据模型model.java；
(3)model.java开始执行业务操作，执行完毕直接给view.jsp页面发送数据更新的通知，这个通知的消息有可能是XML封装的数据，也有可能是一段文本，甚至是一段HTML代码。view.jsp页面中AJAX对象的OnReadyStateChange接收到了数据更新通知，并根据实际情况用DOM进行页面呈现更新。
4 AJAX的安全问题
(1)首先是恶意的用户可能会发送脏数据，尤其是创建攻击性的客户端。AJAX降低了服务器通讯中的用户交互。由于服务器通讯对于用户已经完全不可见，因此，你可以在用户不差觉得情况下传送数据。
(2)AJAX通过使用与Web服务互操作的更具有交互性的页面，AJAX增加了XML、文本和HTML的网络通信量。依赖XML作为请求/相应的内容类型，负载成为了Web服务的弱点。想象一个网页同时有1000个使用者。他们的服务器能够在这样的负荷下处理以正常形式进入的数据。他们一起在客户端或者服务器身上没有做存储而直接进入数据库得到数据的控制。现在我们1000个人将这样的请求重复十次。那这个服务器将达到10倍于以往的运算。如果服务器不能够处理它,他们可能会漏掉或者根本就完全停止了。
(3)考虑下面的OnReadyStateChange JavaScript语句，运行它是为了响应一个XMLHttpRequest:
xmlReq.onreadystatechange ={
if( xmlReq.readyState ＝＝ 4 )
eval( xmlReq.responseText );
}
上面的代码执行包含在来自于XMLHttpRequest的响应中的JavaScript代码。换句话说,有可能出现这种情况:即使一个页面加载完毕，也有可能在后台再进行添加或修改JavaScript函数和代码。因此就算你观察该页面代码的源代码-它可能发送了键击或鼠标移动事件到Web服务器,你也无法确信你所见的代码是当前执行的唯一代码。把这些特征与一些令人胆战心惊的困惑结合起来，那么你可以看到，恶意目的与XMLHttpRequest对象相结合，怎么不能实现Web客户的信息窃取。
因此，Eric Pascarello为AJAX安全性所提出的经验法则[2]：
(1)如果你使用身份验证,确定你在请求页上检查。
(2)为SQL注入检查。
(3)为JavaScript注入检查。
(4)保留商务逻辑在服务器上。
(5)不要假设每个请求是真正的。
(6)确认检查数据。
(7)审查请求的数据而且确定它是正确的。
5AJAX的缺陷
AJAX不是完美的技术,使用AJAX,必然要考虑他的一些不足:AJAX大量使用了JavaScript和AJAX引擎,而这个取决于浏览器的支持。IE510及以上版本,Mozilla110,NetScape7及以上版本才支持,Mozilla虽然也支持AJAX,但是提供XML HttpRequest 的方式不一样。所以使用AJAX的程序必须进行针对各个浏览器的兼容性测试。AJAX更新页面内容的时候并没有刷新整个页面,因此,网页的后退功能是失效的;有的用户还经常搞不清楚现在的数据是旧的还是已经更新过的。这个就需要在明显位置提醒用户“数据已更新”。对流媒体的支持没有Flash,J ava Applet好。一些手持设备(如手机、PDA等)现在还不能很好地支持AJAX。
6 AJAX应用与展望
AJAX理念的出现，揭开了无刷新更新页面时代的序幕，并有代替传统web开发中采用form递交方式更新web页面的趋势，可以算是一个里程碑。但AJAX都不是适用于所有地方的，它的适用范围是由它的特性所决定的。AJAX适用于交互较多、频繁读数据、数据分类良好的WEB应用。
目前AJAX已经成为了Web应用中增强用户体验的主流开发技术，大量的业界巨头对AJAX的支持与大力推动，加上大量开源的Javascript组件库和AJAX框架的出现，我们完全有理由相信AJAX的光明前景。
参考文献：
[1]Ryan Asleson ,Nathaniel T Schutta. Foundations of Ajax.Apress L . P. 2005.
[2]Jesse James Garrett. Ajax: A New Approach to Web Applications[EB/OL], http://www.adaptivepath.com/publications/essays/archives/000385.php .
[3]Dave Crane ,Eric Pascarello. Ajax in Action[M]. Manning Publications,2006 .
[4]Rohit Khare. Beyond AJAX:Accelerating Web Applications with Real Time Event Notification. August 2005.
[5]ohn MacKenzie ,Andrew McAlister ,Sahil Desai ,et al . Usa2bility in Web Design. 2005（10）.
[6]David Teare. Ajax 简介. http :/ / dev2dev. bea. com. cn/techdoc/ 2005110103. html. 2005（1）.