首页 > 代码库 > Ajax的工作原理

Ajax的工作原理

Ajax的工作原理

ajax 的全称是Asynchronous(异步的意思) JavaScript and XML。是一种创建交互式网页应用的网页开发技术

ajax技术的流行得益于google的大力推广。正是由于google产品对ajax技术的广泛应用,使得ajax流行起来了。


Ajax其核心有JavaScript、XMLHTTPRequest、DOM对象组成。通过XmlHttpRequest对象来向server发异步请求。从server获得数据。然后用JavaScript来操作DOM而更新页面。这当中最关键的一步就是从server获得请求数据.
这当中最关键的一步就是从server获得请求数据,要清楚这个过程和原理,我们必须对 XMLHttpRequest有所了解

XMLHttpRequest是ajax的核心机制,它是在IE5中首先引入的,是一种支持异步请求的技术。简单的说,也就是js能够及时向server提出请求和处理响应,而不堵塞用户。

达到无刷新的效果。

XMLHttpRequest 对象方法描写叙述 

方    法描    述
abort()停止当前请求 
getAllResponseHeaders()把HTTP请求的全部响应头部作为键/值对返回
getResponseHeader("header")返回指定头部的串值
open("method","URL",[asyncFlag],["userName"],["password"]) 建立对server的调用。method參数能够是GET、POST或PUT。

url參数能够是相对URL或绝对URL。

这种方法还包含3个可选的參数,是否异步,username,密码

send(content)向server发送请求
setRequestHeader("header", "value")设置HTTP请求时的头部信息。在设置不论什么头部之前必须先调用open()。 设置header并和请求一起发送 (‘post‘方法一定要 )

XMLHttpRequest 对象属性描写叙述

  属  性描    述
onreadystatechange状态改变的事件触发器,每一个状态改变时都会触发这个事件处理器,一般会调用一个JavaScript函数
readyState请求的状态。有5个可取值:0 = 未初始化,1 = 正在载入,2 = 已载入。3 = 交互中,4 = 完毕
0 (未初始化) 对象已建立。可是尚未初始化(尚未调用open方法)
1 (初始化) 对象已建立,尚未调用send方法
2 (发送数据) send方法已调用,可是当前的状态及http头未知
3 (数据传送中) 已接收部分数据,由于响应及http头不全,这时通过responseXml和responseText获取部分数据会出现错误,
4 (完毕) 数据接收完毕,此时能够通过通过responseXml和responseText获取完整的响应数据
responseTextserver的响应,返回数据的文本。
responseXMLserver的响应,返回数据的兼容DOM的XML文档对象 ,这个对象能够解析为一个DOM对象。

responseBody server返回的主题(非文本格式)
responseStreamserver返回的数据流
statusserver的HTTP状态码(如:404 = "文件末找到" 、200 ="成功" 。等等)
statusTextserver返回的状态文本信息 ,HTTP状态码的对应文本(OK或Not Found(未找到)等等)

ajax的长处

1、最大的一点是页面无刷新。在页面内与server通信,给用户的体验很好。

2、使用异步方式与server通信。不须要打断用户的操作,具有更加迅速的响应能力。 3、能够把曾经一些server负担的工作转嫁到client。利用client闲置的能力来处理。减轻server和带宽的负担。节约空间和宽带租用成本。而且减轻server的负担。ajax的原则是“按需取数据”。能够最大程度的降低冗余请求,和响应对server造成的负担。 4、基于标准化的并被广泛支持的技术。不须要下载插件或者小程序。

ajax的缺点

1、ajax干掉了浏览器的backbutton。对浏览器后退机制的破坏。 2、安全问题,ajax技术就如同对企业数据建立了一个直接通道,暴露出请求的接口的数据. 3、对搜索引擎支持的不有好. 4、破坏了程序的异常机制,假设程序抛出异常,对调试带来不方便。


技术分享

Ajax的工作原理