简明现代魔法 -> JavaScript -> JavaScript教程:使用XMLHttpRequest

JavaScript教程:使用XMLHttpRequest

2009-12-30

HTTP 规定了浏览器和服务器之间的请求与响应。HTTP 一般不在脚本的控制之下,而是当用户进行某些动作之后才发生。

这里,我们考虑的是,JavaScript 代码如何与服务器通信。 XMLHttpRequest 可以实现对 HTTP 完全的访问,它可以同步或异步地返回 Web 服务器的请求,并且可以以文本或 DOM 文档的形式返回内容。 XMLHttpRequest 是 Ajax 的 Web 应用程序架构的一项关键功能。

使用 XMLHttpRequest 脚本化 HTTP 有3个步骤:

获取一个请求对象

可以通过一个简单的构造函数调用来创建一个 XMLHttpRequest 对象。

var request = new XMLHttpRequest();  

提交一个请求

创建了一个 XMLHttpRequest 对象之后,下一步就是向 Web 服务器提交一个请求。

首先,调用 open() 方法来指定所请求的 URL 以及该请求的 HTTP 方法。大多数 HTTP 请求都是用 GET 方法完成的,该方法只是下载该 URL 的内容。另一个方法是 POST,这是大多数 HTML 表单所使用的方法,它允许指定变量的值作为请求的一部分。

request.open("GET", url, false);  

默认情况下,open() 方法设置一个异步的 XMLHttpRequest。将 false 作为第3个参数,这是告诉函数同步地而不是异步地获取服务器的响应。open() 并不实际地向 Web 服务器发送请求,它只是保存自己的参数,等到稍后实际发送请求的时候再使用。在发送请求之前,必须设置所有所需的请求头部。

最后,需要把请求发送给服务器:

request.send(null);  

send() 函数的参数是请求体,对于 HTTP 的 GET 请求,参数总是为 null。

获取一个同步响应

如果把 false 作为 open() 的第3个参数,send() 方法是同步的,它会阻塞而不会返回,直到服务器响应到达为止。

我们可以使用请求对象的 status 属性来检查服务器所返回的 HTTP 状态代码。这个代码在 HTTP 中已经定义了。如果 status == 200,就意味着请求成功,并且这个响应可以获得。如果 status == 404,则表示请求的 URL 不存在并发生“未找到”错误。

request 对象的 responseText 属性可以将 Web 服务器的响应成为一个可用的字符串。如果响应的是一个 XML 文档,也可以通过 responseXML 属性把该文档作为一个 DOM Document 对象来访问。为了让 XMLHttpRequest 能够把响应解析到一个 Document 对象中,服务器必须使用 MIME 类型“text/xml”来标识其 XML 文档。

if (request.status == 200) {
	alert(request.responseText);
}
else (
	alert("Error" + request.ststus + ":" + request.statusText);
} 

处理一个异步响应

要在异步模式中使用一个 XMLHttpRequest,要将 true 作为 open() 的第三个参数。

XMLHttpRequest 的 readyState 值

readyState 含义
0 open() 还没调用
1 open() 已经调用,但 send() 还没调用
2 send() 已经调用,但服务器还没有响应
3 正在从服务器接收数据
4 服务器的响应完成

  

随机文章推荐
网站分类


注:如需转载本文,请注明出处(原文链接),谢谢。更多精彩内容,请进入简明现代魔法首页。

进入新博客
喜欢本文,就分享它吧
给我留言
您的名字:
您的邮件:
您的网站:


 

copyright © 2009 简明现代魔法    学习、分享、进步

power by Gonn 感谢所有关心和支持本站的朋友们