`
happmaoo
  • 浏览: 4338141 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

XMLHttpRequest的同步和异步请求

阅读更多

客户端利用XMLHTTP发送请求得到服务端应答数据,并用Javascript操作DOM最终更新页面- 又称无刷新更新页面,有代替传统web开发中采用form(表单)递交方式更新web页面的趋势。

XMLHTTP依赖于XMLHttpRequest完成从客户端的请求到服务端的应答。XMLHttpRequest提供了两个方法open和send。open方法用于初始化XMLHttpRequest
对象、指示请求的方式(get、post等)、安全性连接等,在调用open方法后必须调用send方法发送Http Request(Http请求)以返回Http Reponse(Http应答)。
看MSDN中对send方法的简介:
This method is synchronous or asynchronous, depending on the value of the bAsync parameter in the open call. If open is called with bAsync == False, this call does not return until the entire response is received or the protocol stack times out. If open is called with bAsync == True, this call returns immediately.
send方法是否同步或异步工作取决于open方法中的bAsync参数,如果bAsync == False表示send方法工作在同步状态下,发送http请求后,只有当客户端接收到来自服务端的全部应答数据或协议栈超时返回!反之bAsync == True,工作在异步状态下,直接返回。

实际运用中,设置bAsync = True, 使send方法被调用后XMLHttpRequest工作在异步状态,如果设为同步状态可能会导致不必要的长时间等待!

另外,无论在同步或异步请求工作状态下,XMLHttpRequest如何得到由服务端返回的应答数据?
看下面的示例代码:

<script>
var xmlhttp=null;
function PostOrder(xmldoc)
{
varxmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
xmlhttp.Open("POST", "http://myserver/orders/processorder.asp", false);
xmlhttp.onreadystatechange= HandleStateChange;
xmlhttp.Send(xmldoc);
}
function HandleStateChange()
{
if (xmlhttp.readyState == 4)
{
alert("Result = " + xmlhttp.responseXML.xml);
}
}
</script>

服务端返回应答数据并完全被加载, 可通过XMLHttpRequest属性readState获知,其值变为4 - COMPLETED (已加载完成),
当readState变化时会调用XMLHttpRequest对象中的回调函数onreadstatechange,在函数中验证xmlhttp.readyState == 4,
这里得到的是XML文档(如果服务端有返回xml文档数据).

分享到:
评论

相关推荐

    详解XMLHttpRequest(一)同步请求和异步请求

    XMLHttpRequest 让发送一个HTTP请求变得非常容易。你只需要简单的创建一个请求对象实例,打开一个URL,然后发送这个请求。...两种通信模式:同步和异步请求:  同步请求  主线程中的同步请求会阻塞页面,由于对

    mimic.js:JavaScript XML-RPC 客户端支持同步和异步请求

    它被归类为客户端,因为它只能生成请求和解析响应,因此您不能使用它来解析请求并根据服务器实现的要求生成响应。 它旨在嵌入到网页中,并使它们能够通过 W3C XMLHttpRequest 接口访问基于 XML-RPC 的 Web 服务。 ...

    XMLHttpRequest对象_Ajax异步请求重点(推荐)

    一、XMLHttpRequest对象 1.Ajax能够是实现异步传输,所依赖的就是JavaScript中的XMLHttpRequest 2.XMLHttpRequest对象是XMLHttp组件的对象,它是一个...5.在使用XMLHttpRequest发送请求和处理相应之前需要先创建一个XM

    Sy5_AjAx.rar

    3. 学会使用Ajax同步/异步请求文本数据(字符串); 4. 掌握XML的编写规范,能够编写XML文件; 5. 学会使用Ajax同步/异步请求XML数据。 6. 掌握JSON的编写规范,能够编写JSON文件; 7. 学会使用Ajax异步请求JSON数据...

    原生JavaScrpit中异步请求Ajax实现方法

    在前端页面开发的过程中,经常使用到Ajax...JavaScript实现Ajax异步请求 简单的ajax请求实现 Ajax请求的原理是创建一个XMLHttpRequest对象,使用这个对象来进行异步发送请求,具体实现参考下面代码: function ajax

    原生JavaScript实现Ajax异步请求

    在前端页面开发的过程中,经常使用到Ajax...JavaScript实现Ajax异步请求 简单的ajax请求实现 Ajax请求的原理是创建一个XMLHttpRequest对象,使用这个对象来进行异步发送请求,具体实现参考下面代码: function ajax

    Java异步请求

    传统web交互模型,浏览器直接将请求发送给服务器,服务器回送响应,直接发给浏览器, Ajax交互模型,浏览器首先将请求 发送 Ajax引擎(以XMLHttpRequest为核心),AJax引擎再将请求发送给 服务器,服务器回送响应先...

    ajax 同步请求和异步请求的差异分析

    ajax同步和异步的差异, 先看2段代码: 代码一: 代码如下: Synchronize = function(url,param) { function createXhrObject() { var http; var activeX = [ “MSXML2.XMLHTTP.3.0”, “MSXML2.XMLHTTP”, ...

    ajax长连接式的浏览器、服务器的全双工通信框架.rar

    借助于Ajax,可以在用户单击按钮时,使用JavaScript和DHTML立即更新UI,并向服务器发出异步请求,以执行更新或查询数据库。当请求返回时,就可以使用JavaScript和CSS来相应地更新UI,而不是刷新整个页面。最重要的是...

    AJAX(XMLHttpRequest.status)状态码

    下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String ...(默认: true) 默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。注意,同步请求将锁住浏览器

    Ajax课件学习(免费)

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

    javascript

    使用 XMLHttpRequest 脚本化 HTTP 有3个步骤: • 创建一个 XMLHttpRequest 对象 • 指定 HTTP 请求并向一个 Web 服务器提交 • 同步或异步地获得服务器的响应

    Web前端Ajax&JQuery视频教程课件

    本套Java教程涵盖Ajax的实现原理,XMLHttpRequest实现Ajax,回调函数,Ajax数据交换格式(HTML、XML、JSON),Ajax发送GET和POST请求,异步编程模型和同步编程模型,解决Ajax的GET请求缓存问题,使用Ajax验证用户名...

    jQuery 1.6 API 中文版

    跨域请求和dataType: "jsonp"请求不支持同步操作。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。 beforeSend(jqXHR, settings)Function 发送请求前可修改 jqXHR(在jQuery 1.4.x的中,...

    原生js jquery ajax请求以及jsonp的调用方法

    XMLHttpRequest,异步访问服务器并发送请求数据,服务器返回响应的数据,以页面无刷新的效果改变页面中的局部内容 同步:任务一个一个的执行,只有前面的任务执行完才会执行下一个任务,如果前面的任务是耗时操作,...

    Ajax技术课件,保密资料下载

    1 异步请求对象 xhr javascript对象 ---- 浏览器中 ---- 浏览器差异 window.XMLHttpRequest window.ActiveXObject Firefox XMLHttpRequest var xhr = new XMLHttpRequest(); IE ActiveXObject ...

    Jquery揭秘系列:ajax原生js实现详解(推荐)

    讲到ajax这个东西,我们要知道两个对象XMLHTTPRequest和ActiveXObject ,提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。可以同步或异步返回 Web 服务器的响应,并且能以...

    AJAX应用中必须要掌握的重点知识(分享)

    AJAX是什么? 是Asynchronous Javascript And XML的首字母的缩写,...XMLHTTPRequest,简写XHR,Xml可扩展标记语言,Http超文本传输协议,Request请求。XMLHttpRequest对象可以在不向服务器提交整个页面的情况下,实现局

    testability-browser-bindings:仪器浏览器,用于自动应用程序可测试性状态检测

    自动不可测试状态检测对于以下异步事件,它将自动报告不可测试的应用程序状态: 使用XmlHttpRequest Ajax请求setTimeout / clearTimeout :仅在时间小于5秒时使用,否则将被视为超时。 setImmediate / ...

Global site tag (gtag.js) - Google Analytics