XMLHttpRequest
From MDC
XMLHttpRequest是一个JavaScript对象,它由微软创立并被Mozilla接受。你可以使用它来轻松的通过HTTP处理数据。尽管它的名字里含有xml,但是它的使用范围却并不局限于xml。在Gecko中,这个对象实现nsIJSXMLHttpRequest和nsIXMLHttpRequest接口。Gecko的新近版本对这个对象有了一些修改,请见:XMLHttpRequest changes for Gecko1.8。
目录 |
[编辑] 基本使用方法
使用XMLHttpRequest是非常简单的。你可以创建这个对象的一个实例,打开一个URL,然后发送请求。然后,你就可以在那个请求对象中找到HTTP状态代码和结果文档。
[编辑] 示例
var req = new XMLHttpRequest();
req.open('GET', 'http://www.mozilla.org/', false);
req.send(null);
if(req.status == 200)
dump(req.responseText);
[编辑] 无HTTP协议的例子
var req = new XMLHttpRequest();
req.open('GET', 'file:///home/user/file.json', false);
req.send(null);
if(req.status == 0)
dump(req.responseText);
[编辑] 异步使用
如果你想在一个扩展中使用XMLHttpRequest,那么应该使用异步载入。在异步使用的中,数据被返回的时候你会得到一个回调(callback),它允许浏览器在你发生请求操作的时候依然像平常一样继续工作。
[编辑] 示例
var req = new XMLHttpRequest();
req.open('GET', 'http://www.mozilla.org/', true);
req.onreadystatechange = function (aEvt) {
if (req.readyState == 4) {
if(req.status == 200)
dump(req.responseText);
else
dump("Error loading page\n");
}
};
req.send(null);
[编辑] 监视进程
XMLHttpRequest还具有监听那些在请求被处理期间发生的变化事件的功能。这包括周期的处理通知、错误通知等等。
如果你希望在文档正在被接受的期间,提供一些处理进程的信息给用户,你可以像下面这样使用代码:
function onProgress(e) {
var percentComplete = (e.position / e.totalSize)*100;
...
}
function onError(e) {
alert("Error " + e.target.status + " occurred while receiving the document.");
}
function onLoad(e) {
// ...
}
// ...
var req = new XMLHttpRequest();
req.onprogress = onProgress;
req.open("GET", url, true);
req.onload = onLoad;
req.onerror = onError;
req.send(null);
事件onprogress的属性,position和totalSize,分别表示了当前收到的信息的大小和被期望的信息的总大小.
所有这些事件都有它们自己的target属性,它指向用来通信的code>XMLHttpRequest</code>对象的.
[编辑] 其他的属性和方法
除了上面提到的属性和方法,request对象中还有其他的有用的属性和方法。
[编辑] responseXML
如果你载入一个XML文档,那么 responseXML 属性将包含一个类似XmlDocument对象的文档,你可以使用DOM方法来操作它。如果服务器发回了一个格式很好的XML但并没有指定一个XML Content-Type头,那么你可以使用overrideMimeType()来强制将文档作为XML来处理。如果服务器并没有发回一个格式严谨的XML,那么无论重载任何内容,responseXML的值都将是空(null)。
[编辑] overrideMimeType()
这种方法可以用来强制一个文档被当作一种特殊定内容形式来处理。当服务器端返回给你的XML并没有正确的Content-Type头,而你想使用responseXML来处理的时候,你会很经常的用到它。send()之前调用它。
var req = new XMLHttpRequest();
req.open('GET', 'http://www.mozilla.org/', true);
req.overrideMimeType('text/xml');
req.send(null);
[编辑] setRequestHeader()
这个方法可以用来在你发出请求之前,设置一个HTTP头。
open()
var req = new XMLHttpRequest();
req.open('GET', 'http://www.mozilla.org/', true);
req.setRequestHeader("X-Foo", "Bar");
req.send(null);
[编辑] getResponseHeader()
这个方法可以用来从服务器的应答中获得一个HTTP头。
var req = new XMLHttpRequest();
req.open('GET', 'http://www.mozilla.org/', true);
req.send(null);
dump("Content-Type: " + req.getResponseHeader("Content-Type") + "\n");
[编辑] 使用XPCOM组件
XMLHttpRequest不能在一个JavaScript XPCOM组件中使用XMLHttpRequest()来实例化。在组件中并没有定义这个构造函数,所以会发生错误。你需要创建并使用另一种语法。
这样的方法将不能完成任务:
var req = new XMLHttpRequest();
req.onprogress = onProgress;
req.onload = onLoad;
req.onerror = onError;
req.open("GET", url, true);
req.send(null);
取而代之的,你应该这样写:
var request = Components.
classes["@mozilla.org/xmlextras/xmlhttprequest;1"].
createInstance();
// QI the object to nsIDOMEventTarget to set event handlers on it:
request.QueryInterface(Components.interfaces.nsIDOMEventTarget);
request.addEventListener("progress", function(evt) { ... }, false);
request.addEventListener("load", function(evt) { ... }, false);
request.addEventListener("error", function(evt) { ... }, false);
// QI it to nsIXMLHttpRequest to open and send the request:
request.QueryInterface(Components.interfaces.nsIXMLHttpRequest);
request.open("GET", "http://www.example.com/", true);
request.send(null);