AJAX 简介( 二 )


 
进行Ajax开发时,网络延迟——即用户发出请求到服务器发出响应之间的间隔——需要慎重考虑 。如果不给予用户明确的回应[4],没有恰当的预读数据[5],或者对XMLHttpRequest的不恰当处理[6],都会使用户感到厌烦[7] 。通常的解决方案是,使用一个可视化的组件来告诉用户系统正在进行后台操作并且正在读取数据和内容 。
 
对程序员而言,开发Ajax应用最头痛的问题莫过于以下几点:
 
Ajax在本质上是一个浏览器端的技术,首先面临无可避免的第一个问题即是浏览器的兼容性问题 。各家浏览器对JavaScript/DOM/css的支持总有部分不太相同或是有Bug,甚至同一浏览器的各个版本间对于JavaScript/DOM/CSS的支持也有可能部分不一样 。这导致程序员在写Ajax应用时花大部分的时间在调试浏览器的兼容性而非在应用程序本身 。因此,目前大部分的Ajax链接库或开发框架大多以js链接库的形式存在,以定义更高阶的JavaScript API、JavaScript对象(模板)、或者JavaScript Widgets来解决此问题 。如prototype.js 。
 
Ajax技术之主要目的在于局部交换客户端及服务器之间的数据 。如同传统之主从架构,无可避免的会有部分的业务逻辑会实现在客户端,或部分在客户端,部分在服务器 。由于业务逻辑可能分散在客户端及服务器,且以不同之程序语言实现,这导致Ajax应用程序极难维护 。如有使用者接口或业务逻辑之更动需求,再加上前一个JavaScript/DOM/CSS之兼容性问题,Ajax应用往往变成程序员的梦魇 。针对业务逻辑分散的问题,Ajax开发框架大致可分为两类:
 
将业务逻辑及表现层放在浏览器,数据层放在服务器:因为所有的程序以JavaScript执行在客户端,只有需要数据时才向服务器要求服务,此法又称为胖客户端(fat client)架构 。服务器在此架构下通常仅用于提供及储存数据 。此法的好处在于程序员可以充分利用JavaScript搭配业务逻辑来做出特殊的使用者接口,以符合终端使用者的要求 。但是问题也不少,主因在第一,JavaScript语言本身之能力可能不足以处理复杂的业务逻辑 。第二,JavaScript的执行效能一向不好 。第三,JavaScript存取服务器数据,仍需适当的服务器端程序之配合 。第四,浏览器兼容性的问题又出现 。有些Ajax开发框架如DWR企图以自动生成JavaScript之方式来避免兼容的问题,并开立通道使得JavaScript可以直接叫用服务器端的Java程序来简化数据的存取 。但是前述第一及第二两个问题仍然存在,程序员必须费相当的力气才能达到应用程序之规格要求,或可能根本无法达到要求 。
 
将表现层、业务逻辑、及数据层放在服务器,浏览器仅有使用者接口引擎(User Interface engine);此法又称为瘦客户端(thin client)架构,或中心服务器(server-centric)架构 。浏览器的使用者接口引擎仅用于反映服务器的表现层以及传达使用者的输入回到服务器的表现层 。由浏览器所触发之事件亦送回服务器处理,根据业务逻辑来更新表现层,然后反映回浏览器 。因为所有应用程序完全在服务器执行,数据及表现层皆可直接存取,程序员只需使用服务器端相对较成熟之程序语言(如Java语言)即可,不需再学习JavaScript/DOM/CSS,在开发应用程序时相对容易 。缺点在于使用者接口引擎以及表现层通常以标准组件的形式存在,如需要特殊组件(使用者接口)时,往往须待原框架之开发者提供,缓不济急 。如开源码Ajax开发框架ZK目前支持XUL及XHTML组件,尚无XAML之支持 。
 
JavaScript编程的最大问题来自不同的浏览器对各种技术和标准的支持 。
XmlHttpRequest对象在不同浏览器中不同的创建方法,以下是跨浏览器的通用方法:
// Provide the XMLHttpRequest class for IE 5.x-6.x:// Other browsers (including IE 7.x-8.x) ignore this// when XMLHttpRequest is predefinedvar xmlHttp;if (typeof XMLHttpRequest != "undefined") { xmlHttp = new XMLHttpRequest();} else if (window.ActiveXObject) { var aVersions = ["Msxml2.XMLHttp.5.0", "Msxml2.XMLHttp.4.0", "Msxml2.XMLHttp.3.0", "Msxml2.XMLHttp", "Microsoft.XMLHttp"]; for (var i = 0; i < aVersions.length; i++) { try { xmlHttp = new ActiveXObject(aVersions[i]); break; } catch (e) {} }}

参考链接:
https://zh.wikipedia.org/zh-hans/AJAX




推荐阅读