AJAX简介-程序员宅基地

技术标签: java  php  ruby  

基本介绍

AJAX 指异步 JavaScript 及 XML(Asynchronous JavaScript And XML)。

内翻译常为“阿贾克斯”和阿贾克斯足球队同音。Web应用的交互如Flickr,Backpack和Google在这方面已经有质的飞跃。这个术语源自描述从基于Web的应用到基于数据的应用的转换。在基于数据的应用中,用户需求的数据如联系人列表,可以从独立于实际网页的服务端取得并且可以被动态地写入网页中,给缓慢的Web应用体验着色使之像桌面应用一样。

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。

Ajax对服务器没什么要求,可以为Java EE应用程序,.NET应用程序和其他类型的应用程序服务。可以通过Ajax,可以编写javascript代码来改进HTML,创建出丰富的交互性用户体验。

折叠编辑本段开发模式

许多重要的技术和AJAX开发模式可以从现有的知识中获取。例如,在一个发送请求到服务端的应用中,必须包含请求顺序、优先级、超时响应、错误处理及回调,其中许多元素已经在Web服务中包含了,就像现在的SOA。AJAX开发人员拥有一个完整的系统架构知识。同时,随着技术的成熟还会有许多地方需要改进,特别是UI部分的易用性。

AJAX开发与传统的CS开发有很大的不同。这些不同引入了新的编程问题,最大的问题在于易用性。由于AJAX依赖浏览器的JavaScript和XML,浏览器的兼容性和支持的标准也变得和JavaScript的运行时性能一样重要了。这些问题中的大部分来源于浏览器、服务器和技术的组合,因此必须理解如何才能最好的使用这些技术。

综合各种变化的技术和强耦合的客户服务端环境,AJAX提出了一种新的开发方式。AJAX开发人员必须理解传统的MVC架构,这限制了应用层次之间的边界。同时,开发人员还需要考虑CS环境的外部和使用AJAX技术来重定型MVC边界。最重要的是,AJAX开发人员必须禁止以页面集合的方式来考虑Web应用而需要将其认为是单个页面。一旦UI设计与服务架构之间的范围被严格区分开来后,开发人员就需要更新和变化的技术集合了。

折叠编辑本段开发框架

随着AJAX迅速地引人注目起来,我想开发人员对这种技术的期待也迅速地增加。就像任何新技术,AJAX的兴旺也需要一整个开发工具/编程语言及相关技术系统来支撑。

折叠主要包含的技术

web标准(standards-based presentation)XHTML+CSS的表示;

使用 DOM(Document Object Model)进行动态显示及交互;

使用 XML 和 XSLT 进行数据交换及相关操作;

使用 XMLHttpRequest 进行异步数据查询、检索;

使用 JavaScript 将所有的东西绑定在一起。英文参见Ajax的提出者Jesse James Garrett的原文,原文题目(Ajax: A New Approach to Web Applications)。

类似于DHTML或LAMP,AJAX不是指一种单一的技术,而是有机地利用了一系列相关的技术。事实上,一些基于AJAX的“派生/合成”式(derivative/composite)的技术正在出现,如“AFLAX”。

AJAX的应用使用支持以上技术的web浏览器作为运行平台。这些浏览器目前包括:

Google Chrome、Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。但是Opera不支持XSL格式对象,也不支持XSLT。

折叠JavaScript

如名字所示,AJAX的概念中最重要而最易被忽视的是它也是一种JavaScript编程语言。JavaScript是一种粘合剂使AJAX应用的各部分集成在一起。在大部分时间,JavaScript通常被服务端开发人员认为是一种企业级应用不需要使用的东西应该尽力避免。这种观点来自以前编写JavaScript代码的经历:繁杂而又易出错的语言。类似的,它也被认为将应用逻辑任意地散布在服务端和客户端中,这使得问题很难被发现而且代码很难重用。在AJAX中JavaScript主要被用来传递用户界面上的数据到服务端并返回结果。XMLHttpRequest对象用来响应通过HTTP传递的数据,一旦数据返回到客户端就可以立刻使用DOM将数据放到网面上。

折叠XMLHttpRequest

XMLHttpRequest对象在大部分浏览器上已经实现而且拥有一个简单的接口允许数据从客户端传递到服务端,但并不会打断用户当前的操作。使用XMLHttpRequest传送的数据可以是任何格式,虽然从名字上建议是XML格式的数据。

开发人员应该已经熟悉了许多其他XML相关的技术。XPath可以访问XML文档中的数据,但理解XML DOM是必须的。类似的,XSLT是最简单而快速的从XML数据生成HTML或XML的方式。许多开发人员已经熟悉Xpath和XSLT,因此AJAX选择XML作为数据交换格式是有意义的。XSLT可以被用在客户端和服务端,它能够减少大量的用JavaScript编写的应用逻辑。

折叠CSS

为了正确的浏览AJAX应用,CSS是一种AJAX开发人员所需要的重要武器。CSS提供了从内容中分离应用样式和设计的机制。虽然CSS在AJAX应用中扮演至关重要的角色,但它也是构建跨浏览器应用的一大阻碍,因为不同的浏览器厂商支持各种不同的CSS级别。

折叠服务器端

但不像在客户端,在服务端AJAX应用还是使用建立在如Java,.Net和PHP语言基础上机制;并没有改变这个领域中的主要方式。

既然如此,我们对Ruby on Rails框架的兴趣也就迅速增加了。在一年多以前,Ruby on Rails已经吸引了大量开发人员基于其强大功能来构建Web和AJAX应用。虽然目前还有很多快速应用开发工具存在,Ruby o n Rails看起来已经储备了简化构建AJAX应用的能力。

折叠编辑本段优劣分析

折叠优点:更迅捷的响应速度

传统的web应用允许用户填写表单(form),当提交表单时就向web服务器发送一个请求。服务器接收并处理传来的表单,然後返回一个新的网页。这个做法浪费了许多带宽,因为在前後两个页面中的大部分HTML代码往往是相同的。由于每次应用的交互都需要向服务器发送请求,应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。

与此不同,AJAX应用可以仅向服务器发送并取回必需的数据,它使用SOAP或其它一些基于XML的web service接口,并在客户端采用JavaScript处理来自服务器的响应。因此在服务器和浏览器之间交换的数据大量减少,结果我们就能看到响应更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成,所以Web服务器的处理时间也减少了。

使用Ajax的最大优点,就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改变过的信息。

Ajax不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。就像DHTML应用程序那样,Ajax应用程序必须在众多不同的浏览器和平台上经过严格的测试。随着Ajax的成熟,一些简化Ajax使用方法的程序库也相继问世。同样,也出现了另一种辅助程序设计的技术,为那些不支持JavaScript的用户提供替代功能。

折叠缺点与其中一些问题的对应解决方案

对应用Ajax最主要的批评就是,它可能破坏浏览器后退按钮的正常行为。在动态更新页面的情况下,用户无法回到前一个页面状态,这是因为浏览器仅能记下历史记录中的静态页面。一个被完整读入的页面与一个已经被动态修改过的页面之间的差别非常微妙;用户通常都希望单击后退按钮,就能够取消他们的前一次操作,但是在Ajax应用程序中,却无法这样做。不过开发者已想出了种种办法来解决这个问题,当中大多数都是在用户单击后退按钮访问历史记录时,通过建立或使用一个隐藏的IFRAME来重现页面上的变更。(例如,当用户在Google Maps中单击后退时,它在一个隐藏的IFRAME中进行搜索,然后将搜索结果反映到Ajax元素上,以便将应用程序状态恢复到当时的状态。)

一个相关的观点认为,使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中。该问题的解决方案也已出现,大部分都使用URL片断标识符(通常被称为锚点,即URL中#后面的部分)来保持跟踪,允许用户回到指定的某个应用程序状态。(许多浏览器允许JavaScript动态更新锚点,这使得Ajax应用程序能够在更新显示内容的同时更新锚点。)这些解决方案也同时解决了许多关于不支持后退按钮的争论。

进行Ajax开发时,网络延迟——即用户发出请求到服务器发出响应之间的间隔——需要慎重考虑。不给予用户明确的回应 ,没有恰当的预读数据 ,或者对XMLHttpRequest的不恰当处理,都会使用户感到延迟,这是用户不欲看到的,也是他们无法理解的。通常的解决方案是,使用一个可视化的组件来告诉用户系统正在进行后台操作并且正在读取数据和内容。

一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax;

用JavaScript作的Ajax引擎,JavaScript的兼容性和DeBug都是让人头痛的事;

Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带来困扰――用户不太清楚现在的数据是新的还是已经更新过的;现有的解决有:在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等;

对串流媒体的支持没有FLASH、Java Applet好;

折叠编辑本段程序架构

折叠1纯Javascript:应用程序框架

1.1 Bindows(自从2003年)

它,通过强力联合DHTML,JavaScript,CSS和XML等技术,能生成高度交互的互联网应用程序-成为现代的桌面应用程序的强有力对手。Bindows应用程序不要求下载和也不需要在用户端安装-仅要求有一个浏览器(也不需要Java,Flash或者ActiveX)。Bindows有可能领导面向对象开发的AJAX应用程序的平台。

1.2 BackBase(自从2003年)

网址是:,是一个全面的浏览器端框架,支持丰富的浏览器功能以及与.NET和Java的集成。

·商业化,来自于Backbase B.V(总部在Amsterdam,成立于2003年)。

1.3 DOJO(开发中;自从2004年9月)

网址是:/,提供全面窗口小组件和浏览器-服务器消息支持。

·为创建定制的Javascript窗口小组件提供框架支持。

1.4 Open Rico(开发中;自从2005年5月;基于早期的私有框架)

网址是:,是一多用途框架,支持Ajax基础结构和用户交互。

1.5 qooxdoo(开发中;自从2005年5月)

网址是:,是另一个雄心勃勃的框架,提供宽范围的UI支持和正在开发中的基础结构特性。

1.6 Tibet(开发中;自从2005年6月)

网址是:,目的是提供高度可移植的和全面的Javascript API,结果是,可能自动生成大量的客户端代码。自称是"企业级Ajax"。

折叠2纯Javascript:基础结构框架

2.1 AjaxCaller(Alpha版本;自从2005年5月)

网址是:,是一基本的线程安全的XMLHttpRequest包装器,主要针对Ajax新手,仍处于原始的alpha开发阶段,

2.2 Flash JavaScript集成包

网址是:,允许JavaScript和Flash内容的集成

2.3 Google AJAXSLT(发行于2005年6月)

网址是:,是一个Javascript框架,用来执行XSLT转换以及XPath查询。

2.4 HTMLHttpRequest(Beta版;始于2005年)

HtmlHttpRequest(),它使用了XMLHttpRequest和Iframes以改进兼容性。

2.5 交互式网站框架(自从2005年5月)

交互式网站框架,是一个项目,目的是从浏览器端对Ajax基础结构的多方面予以支持。自描述为"使用javascript,css,xml,和html来创造高度交互网站的框架。包括一个定制的针对高度可读的javascript的xml分析器。实质上,是建立基于AJAX的网站的基础,还有另外一些通用脚本"。

2.6 LibXMLHttpRequest(发行于2003年6月)

/connector?file=reference/2003/06/17/libXmlRequest.html),是XMLHttpRequest的一个瘦包装器。

2.7 RSLite(x)

网站是:http/rs/main.htm,是一个针对XMLHttpRequest的瘦包装器。

2.8 Sack(在开发中,自从2005年5月)

网站是:/2005/05/sack-of-ajax/,是一个针对XMLHttpRequest的瘦包装器。

2.9 Sarissa(发行于2003年,2月)

网站是:http,是一种Javascript API,它封装了在浏览器端可以独立调用XML的功能。

2.10 XHConn(发行于自从2005年,4月)

网站是:/javascript/XHConn/,是一个对XMLHttpRequest的瘦包装器。

2.11 Jquery

简洁的思想:几乎所有操作都是以选择DOM元素(有强大的Selector)开始,然后是对其的操作(Chaining等特性)。

折叠3服务器端:多种语言

3.1 跨平台异步的接口工具箱(2005年5月)

CPAINT:,是一真正的支持PHP和ASP/Vbscript的Ajax实现和JSRS(JavaScript远程脚本)实现。CPAINT提供给你需求的代码在后台实现AJAX和JSRS,而返回的数据以JavaScript形式在前台操作,格式化和显示。这允许你创建能提供接近实时的反馈给用户的web应用程序。

3.2 SAJAX(可用,但是不是1.0版本;自从2005年3月)

网站是:http:///sajax/,直接把调用从Javascript发送到你的服务器端语言并再次回返。

3.3 Javascipt对象标志(JSON)和JSON-RPC

JSON(http/index.html),是一个"胖的自由的XML选择",而JSON-RPC(/)是一种远程过程协议,类似于XML-RPC,强有力支持Javascript客户。

3.4 Javascript远程脚本(JSRS)(自从2000年)

网址是:http/test.htm,直接把调用从Javascript发送到你的服务器端语言并再次回返。

折叠4服务器端:Java

4.1 WebORB for Java(自从2005年8月)

网址:http://weborb/aboutWeborb.htm,是一个平台,支持开发AJAX和基于Flash的胖客户端应用程序,并可以把它们与Java对象和XML Web服务相系起来。在线举例(http)

4.2 Echo 2(自从2005年3月)

网址是:http:///,允许你用纯Java代码编写Ajax应用软件(范例(http://demo./ia))。

4.3 Direct Web Remoting (DWR)(2005年)

网址是:http/,是一个框架,用于直接从Javascript代码中调用Java方法。

4.4 SWATO(2005年)

网址是/,是一套可重用的和良好集成的Java/JavaScript库,它实现了一种更容易的方式来改变你的web应用程序的交互,它是通过AJAX方式实现。

折叠5服务器端:Lisp

5.1 CL-Ajax

网址,实现Javascript直接调用服务器端Lisp函数。

折叠6服务器端:.NET

6.1 WebORB(自从2005年8月)

网址:/aboutWeborb.htm,是一个平台,用于开发AJAX和基于Flash的胖客户端应用程序,并能把它们连接到.NET对象和XML Web服务。(在线举例(http://))

6.2(自从2005年3月)

网址是:http/,是一个库,实现从Javascript到服务器端.NET的存取。

折叠7服务器端:PHP

7.1 AjaxAC(自从2005年4月)

网址是:/,用单个的PHP类封装了完整的应用程序。

7.2 JPSpan

网址是:http,直接把Javascript调用传递到PHP函数。

7.3 XAJAX

网址是:http,直接把Javascript调用传递到PHP函数。

折叠8服务器端:Ruby

Ruby On Rails/)是一个通常的强力支持Ajax的web框架:

折叠编辑本段调试兼容

折叠调试问题

在实际构建AJAX应用中,你需要的不只是文本编辑器。既然JavaScript是非编译的,它可以容易地编写和运行在浏览器中。然而,许多工具提供了有用的扩展如语法高亮和智能完成。

不同的IDE提供了对JavaScript支持的不同等级。来自JetBrains的IntelliJ IDEA是一个用来JavaScript开发的更好的IDE,虽然许多开发人员也喜欢Microsoft’s Visual Studio产品(允诺会在最新的版本中改善对AJAX的支持)。Eclipse包含了两个免费的JavaScript编辑器插件和一个商业的来自ActiveStat的Komodo IDE。

另一个JavaScript和AJAX开发中的问题是调试困难。不同的浏览器提供不同的通常是隐藏的运行时错误信息,而JavaScript的缺陷如双重变量赋值(通常是由于缺少数据类型)使得调试更加困难。在AJAX的开发中,调试就更复杂了,因为其需要标识究竟是客户端还是服务端产生的错误。在过去,JavaScript调试的方法是删除所有代码然后一行行的增加直到错误出现。现在,更多开发人员回到为IE准备的Microsoft Script Debugger和为Mozilla浏览器准备的Venkman。

折叠浏览器兼容性

JavaScript编程的最大问题来自不同的浏览器对各种技术和标准的支持。构建一个运行在不同浏览器(如IE和火狐)是一个困难的任务。因此几种AJAX JavaScript框架或者生成基于服务端逻辑或标记库的JavaScript,或者提供符合跨浏览器AJAX开发的客户端JavaScript库。一些流行的框架包括:Jquery,Backbase,Bitkraft,Django,DOJO,DWR,MochiKit,Prototype,Rico,Sajax,Sarissa,and Script.

这些框架给开发人员更多的空间使得他们不需要担心跨浏览器的问题。虽然这些框架提升了开发人员构建应用的能力,但由于厂商已经开发了更细节的用户界面的打包组件解决方案,因此在AJAX组件市场中需要考虑一些其他因素。例如提供通用用户界面的组件如组合框和数据栅格的几个厂商,都可以被用来在应用中创建良好的通过类似电子数据表方式来查看和编辑数据的体验。但这些组件不仅是封装了组件的用户界面而且包括与服务端数据的通讯方式,这些组件通常使用基于标记方式来实现如或JSF控件。

折叠编辑本段主要问题

折叠浏览器的兼容性问题

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开发框架大致可分为两类:

[1]将业务逻辑及表现层放在浏览器,数据层放在服务器:因为所有的程序以JavaScript执行在客户端,只有需要数据时才向服务器要求服务,此法又称为胖客户端(fat client)架构。服务器在此架构下通常仅用于提供及储存数据。此法的好处在于程序员可以充分利用JavaScript搭配业务逻辑来做出特殊的用户接口,以符合终端用户的要求。但是问题也不少,主因在第一,JavaScript语言本身之能力可能不足以处理复杂的业务逻辑。第二,JavaScript的执行效能一向不好。第三,JavaScript访问服务器数据,仍需适当的服务器端程序之配合。第四,浏览器兼容性的问题又出现。有些Ajax开发框架如DWR企图以自动生成JavaScript之方式来避免兼容的问题,并开立通道使得JavaScript可以直接调用服务器端的Java程序来简化数据的访问。但是前述第一及第二两个问题仍然存在,程序员必须费相当的力气才能达到应用程序之规格要求,或可能根本无法达到要求。

[2]将表现层、业务逻辑、及数据层放在服务器,浏览器仅有用户接口引擎(User Interface engine);此法又称为瘦客户端(thin client)架构,或中心服务器(server-centric)架构。浏览器的用户接口引擎仅用于反映服务器的表现层以及传达用户的输入回到服务器的表现层。由浏览器所触发之事件亦送回服务器处理,根据业务逻辑来更新表现层,然后反映回浏览器。因为所有应用程序完全在服务器执行,数据及表现层皆可直接访问,程序员只需使用服务器端相对较成熟之程序语言(如Java语言)即可,不需再学习JavaScript/DOM/CSS,在开发应用程序时相对容易。缺点在于用户接口引擎以及表现层通常以标准组件的形式存在,如需要特殊组件(用户接口)时,往往须待原框架之开发者提供,缓不济急。如开源码Ajax开发框架ZK目前支持XUL及XHTML组件,尚无XAML之支持。

折叠多进程或多线程的竞争问题

Ajax是以异步的方式向服务器提交需求。对服务器而言,其与传统的提交窗体需求并无不同,而且由于是以异步之方式提交,如果同时有多个Ajax需求及窗体提交需求,将无法保证哪一个需求先获得服务器的响应。这会造成应用程序典型的多进程(process)或多线程(thread)的竞争(racing)问题。程序员因此必须自行处理或在JavaScript里面动手脚以避免这类竞争问题的发生(如Ajax需求未响应之前,先disable送出按钮),这又不必要的增加了程序员的负担。目前已知有自动处理此问题之开发框架似乎只有ZK。    

折叠编辑本段基础应用

折叠创建XMLHttpRequest方法

XMLHttpRequest 类首先由Internet Explorer以ActiveX对象引入,被称为XMLHTTP。后来Mozilla﹑Netscape﹑Safari 和其他浏览器也提供了XMLHttpRequest类,不过它们创建XMLHttpRequest类的方法不同。

对于Internet Explorer浏览器:

xmlhttp_request = new ActiveXObject("Msxml2.XMLHTTP.3.0"); //3.0或4.0,5.0

xmlhttp_request = new ActiveXObject("Msxml2.XMLHTTP");

xmlhttp_request = new ActiveXObject("Microsoft.XMLHTTP");

由于在不同Internet Explorer浏览器中XMLHTTP版本可能不一致,为了更好的兼容不同版本的Internet Explorer浏览器,因此我们需要根据不同版本的Internet Explorer浏览器来创建XMLHttpRequest类,上面代码就是根据不同的Internet Explorer浏览器创建XMLHttpRequest类的方法。

对于Mozilla﹑Netscape﹑Safari等浏览器

创建XMLHttpRequest 方法如下:xmlhttp_request = new XMLHttpRequest();

如果服务器的响应没有XML mime-type header,某些Mozilla浏览器可能无法正常工作。为了解决这个问题,如果服务器响应的header不是text/xml,可以调用其它方法修改该header。

xmlhttp_request = new XMLHttpRequest();

xmlhttp_request.overrideMimeType('text/xml');

在实际应用中,为了兼容多种不同版本的浏览器,一般将创建XMLHttpRequest类的方法写成如下形式:

try{

if( window.ActiveXObject ){

for( var i = 5; i; i-- ){

try{

if( i == 2 ){

xmlhttp_request = new ActiveXObject( "Microsoft.XMLHTTP" ); }

else{

xmlhttp_request = new ActiveXObject( "Msxml2.XMLHTTP." + i + ".0" );

xmlhttp_request.setRequestHeader("Content-Type","text/xml");

xmlhttp_request.setRequestHeader("Charset","gb2312"); }

break;}

catch(e){

xmlhttp_request = false; } } }

else if( window.XMLHttpRequest )

{ xmlhttp_request = new XMLHttpRequest();

if (xmlhttp_request.overrideMimeType)

{ xmlhttp_request.overrideMimeType('text/xml'); } } }

catch(e){ xmlhttp_request = false; }

折叠发送请求

可以调用HTTP请求类的open()和send()方法,如下所示:

xmlhttp_request.open('GET',URL,true);

xmlhttp_request.send(null);

open()的第一个参数是HTTP请求方式—GET,POST或任何服务器所支持的您想调用的方式。按照HTTP规范,该参数要大写;否则,某些浏览器(如Firefox)可能无法处理请求。

第二个参数是请求页面的URL。

第三个参数设置请求是否为异步模式。如果是TRUE,JavaScript函数将继续执行,而不等待服务器响应。这就是"AJAX"中的"A"。

折叠服务器的响应

这需要告诉HTTP请求对象用哪一个JavaScript函数处理这个响应。可以将对象的onreadystatechange属性设置为要使用的JavaScript的函数名,如下所示:

xmlhttp_request.onreadystatechange =FunctionName;

FunctionName是用JavaScript创建的函数名,注意不要写成FunctionName(),当然我们也可以直接将JavaScript代码创建在onreadystatechange之后,例如:

xmlhttp_request.onreadystatechange = function(){

// JavaScript代码段

};

首先要检查请求的状态。只有当一个完整的服务器响应已经收到了,函数才可以处理该响应。XMLHttpRequest 提供了readyState属性来对服务器响应进行判断。

readyState的取值如下:

0 (未初始化)

1 (正在装载)

2 (装载完毕)

3 (交互中)

4 (完成)

所以只有当readyState=4时,一个完整的服务器响应已经收到了,函数才可以处理该响应。具体代码如下:

if (http_request.readyState == 4) { // 收到完整的服务器响应 }

else { // 没有收到完整的服务器响应 }

当readyState=4时,一个完整的服务器响应已经收到了,接着,函数会检查HTTP服务器响应的状态值。完整的状态取值可参见W3C文档。当HTTP服务器响应的值为200时,表示状态正常。

折叠处理从服务器得到的数据

有两种方式可以得到这些数据:

(1) 以文本字符串的方式返回服务器的响应

(2) 以XMLDocument对象方式返回响应

折叠编辑本段应用案例

该技术在1998年前后得到了应用。允许客户端脚本发送HTTP请求(XMLHTTP)的第一个组件由Outlook Web Access小组写成。该组件原属于微软Exchange Server,并且迅速地成为了Internet Explorer 4.0的一部分。部分观察家认为,Outlook Web Access是第一个应用了Ajax技术的成功的商业应用程序,并成为包括Oddpost的网络邮件产品在内的许多产品的领头羊。但是,2005年初,许多事件使得Ajax被大众所接受。Google在它著名的交互应用程序中使用了异步通讯,如Google讨论组、Google地图、Google搜索建议、Gmail等。Ajax这个词由《Ajax: A New Approach to Web Applications》一文所创,该文的迅速流传提高了人们使用该项技术的意识。另外,对Mozilla/Gecko的支持使得该技术走向成熟,变得更为易用。

AJAX前景非常乐观,可以提高系统性能,优化用户界面。AJAX现有直接框架AjaxPro,可以引入AjaxPro.2.dll文件,可以直接在前台页面JS调用后台页面的方法。但此框架与FORM验证有冲突。另外微软也引入了AJAX组件,需要添加AjaxControlToolkit.dll文件,可以在控件列表中出现相关控件。

转载于:https://www.cnblogs.com/yaoxiaodan/p/5353057.html

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_30387663/article/details/96350502

智能推荐

c# 调用c++ lib静态库_c#调用lib-程序员宅基地

文章浏览阅读2w次,点赞7次,收藏51次。四个步骤1.创建C++ Win32项目动态库dll 2.在Win32项目动态库中添加 外部依赖项 lib头文件和lib库3.导出C接口4.c#调用c++动态库开始你的表演...①创建一个空白的解决方案,在解决方案中添加 Visual C++ , Win32 项目空白解决方案的创建:添加Visual C++ , Win32 项目这......_c#调用lib

deepin/ubuntu安装苹方字体-程序员宅基地

文章浏览阅读4.6k次。苹方字体是苹果系统上的黑体,挺好看的。注重颜值的网站都会使用,例如知乎:font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, W..._ubuntu pingfang

html表单常见操作汇总_html表单的处理程序有那些-程序员宅基地

文章浏览阅读159次。表单表单概述表单标签表单域按钮控件demo表单标签表单标签基本语法结构<form action="处理数据程序的url地址“ method=”get|post“ name="表单名称”></form><!--action,当提交表单时,向何处发送表单中的数据,地址可以是相对地址也可以是绝对地址--><!--method将表单中的数据传送给服务器处理,get方式直接显示在url地址中,数据可以被缓存,且长度有限制;而post方式数据隐藏传输,_html表单的处理程序有那些

PHP设置谷歌验证器(Google Authenticator)实现操作二步验证_php otp 验证器-程序员宅基地

文章浏览阅读1.2k次。使用说明:开启Google的登陆二步验证(即Google Authenticator服务)后用户登陆时需要输入额外由手机客户端生成的一次性密码。实现Google Authenticator功能需要服务器端和客户端的支持。服务器端负责密钥的生成、验证一次性密码是否正确。客户端记录密钥后生成一次性密码。下载谷歌验证类库文件放到项目合适位置(我这边放在项目Vender下面)https://github.com/PHPGangsta/GoogleAuthenticatorPHP代码示例://引入谷_php otp 验证器

【Python】matplotlib.plot画图横坐标混乱及间隔处理_matplotlib更改横轴间距-程序员宅基地

文章浏览阅读4.3k次,点赞5次,收藏11次。matplotlib.plot画图横坐标混乱及间隔处理_matplotlib更改横轴间距

docker — 容器存储_docker 保存容器-程序员宅基地

文章浏览阅读2.2k次。①Storage driver 处理各镜像层及容器层的处理细节,实现了多层数据的堆叠,为用户 提供了多层数据合并后的统一视图②所有 Storage driver 都使用可堆叠图像层和写时复制(CoW)策略③docker info 命令可查看当系统上的 storage driver主要用于测试目的,不建议用于生成环境。_docker 保存容器

随便推点

网络拓扑结构_网络拓扑csdn-程序员宅基地

文章浏览阅读834次,点赞27次,收藏13次。网络拓扑结构是指计算机网络中各组件(如计算机、服务器、打印机、路由器、交换机等设备)及其连接线路在物理布局或逻辑构型上的排列形式。这种布局不仅描述了设备间的实际物理连接方式,也决定了数据在网络中流动的路径和方式。不同的网络拓扑结构影响着网络的性能、可靠性、可扩展性及管理维护的难易程度。_网络拓扑csdn

JS重写Date函数,兼容IOS系统_date.prototype 将所有 ios-程序员宅基地

文章浏览阅读1.8k次,点赞5次,收藏8次。IOS系统Date的坑要创建一个指定时间的new Date对象时,通常的做法是:new Date("2020-09-21 11:11:00")这行代码在 PC 端和安卓端都是正常的,而在 iOS 端则会提示 Invalid Date 无效日期。在IOS年月日中间的横岗许换成斜杠,也就是new Date("2020/09/21 11:11:00")通常为了兼容IOS的这个坑,需要做一些额外的特殊处理,笔者在开发的时候经常会忘了兼容IOS系统。所以就想试着重写Date函数,一劳永逸,避免每次ne_date.prototype 将所有 ios

如何将EXCEL表导入plsql数据库中-程序员宅基地

文章浏览阅读5.3k次。方法一:用PLSQL Developer工具。 1 在PLSQL Developer的sql window里输入select * from test for update; 2 按F8执行 3 打开锁, 再按一下加号. 鼠标点到第一列的列头,使全列成选中状态,然后粘贴,最后commit提交即可。(前提..._excel导入pl/sql

Git常用命令速查手册-程序员宅基地

文章浏览阅读83次。Git常用命令速查手册1、初始化仓库git init2、将文件添加到仓库git add 文件名 # 将工作区的某个文件添加到暂存区 git add -u # 添加所有被tracked文件中被修改或删除的文件信息到暂存区,不处理untracked的文件git add -A # 添加所有被tracked文件中被修改或删除的文件信息到暂存区,包括untracked的文件...

分享119个ASP.NET源码总有一个是你想要的_千博二手车源码v2023 build 1120-程序员宅基地

文章浏览阅读202次。分享119个ASP.NET源码总有一个是你想要的_千博二手车源码v2023 build 1120

【C++缺省函数】 空类默认产生的6个类成员函数_空类默认产生哪些类成员函数-程序员宅基地

文章浏览阅读1.8k次。版权声明:转载请注明出处 http://blog.csdn.net/irean_lau。目录(?)[+]1、缺省构造函数。2、缺省拷贝构造函数。3、 缺省析构函数。4、缺省赋值运算符。5、缺省取址运算符。6、 缺省取址运算符 const。[cpp] view plain copy_空类默认产生哪些类成员函数

推荐文章

热门文章

相关标签