xmlhttp是如何完成异步操作的
ajax第一个字母就是Asynchronous-异步,那么到底xmlhttp为何能支持异步操作呢?
大家在使用ajaxpro的时候,经常这么调用服务器端方法
大家在使用ajaxpro的时候,经常这么调用服务器端方法
function DoSomething()
{
MyPage.Method1.Do(val1,val2,CallBack);
}
function CallBack(res)
{
//res.value;
}
{
MyPage.Method1.Do(val1,val2,CallBack);
}
function CallBack(res)
{
//res.value;
}
这样在调用DoSomething方法的时候,会很快返回,用户可以继续操作界面,直到回调函数得到通知运行,再处理本次请求的结果。这就是一次异步操作。
那是通过什么样的机制来完成对CallBack函数的通知的呢,XmlHttpRequest对象支持一种onreadystatechange的委托,请求j状态的更改会触发这个委托。 HTTP 就绪状态表示请求的状态或情形。它用于确定该请求是否已经开始、是否得到了响应或者请求/响应模型是否已经完成。它还可以帮助确定读取服务器提供的响应文本或数据是否安全。在 Ajax 应用程序中需要了解五种就绪状态:
0:请求没有发出(在调用 open() 之前)。
1:请求已经建立但还没有发出(调用 send() 之前)。
2:请求已经发出正在处理之中(这里通常可以从响应得到内容头部)。
3:请求已经处理,响应中通常有部分数据可用,但是服务器还没有完成响应。
4:响应已完成,可以访问服务器响应并使用它。
在ajax中最常用的就是状态标志4,回调函数中发现状态标志为4的时候,就可以做处理请求数据的操作了。
比如创建XmlHttpRequest的代码如下:
function CreateXMLHttpRequest(){
// Initialize Mozilla XMLHttpRequest object
if (window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
// Initialize for IE/Windows ActiveX version
else if (window.ActiveXObject) {
try{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP.3.0");
}
catch (e){
try{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){newsstring = "<div class='loading'>Loading rquest content fail, Please try it again latter</div>";}
}
}
}
// Initialize Mozilla XMLHttpRequest object
if (window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
// Initialize for IE/Windows ActiveX version
else if (window.ActiveXObject) {
try{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP.3.0");
}
catch (e){
try{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){newsstring = "<div class='loading'>Loading rquest content fail, Please try it again latter</div>";}
}
}
}
发出xmlhttprequest并支持回调函数的代码如下:
xmlHttp.onreadystatechange = function(){
// only if xmlHttp shows "complete"
if (xmlHttp.readyState == 4){
// only http 200 to process
if ( xmlHttp.status == 200){
CallBack();
}
}
}
xmlHttp.open("GET", url, true);
xmlHttp.setRequestHeader("If-Modified-Since","0");
xmlHttp.send(null);
// only if xmlHttp shows "complete"
if (xmlHttp.readyState == 4){
// only http 200 to process
if ( xmlHttp.status == 200){
CallBack();
}
}
}
xmlHttp.open("GET", url, true);
xmlHttp.setRequestHeader("If-Modified-Since","0");
xmlHttp.send(null);
CallBack函数就可以执行对请求数据的处理了。
作者:jillzhang
出处:http://jillzhang.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
出处:http://jillzhang.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。