XMLHttpRequest: Difference between revisions
m (categories) |
mNo edit summary |
||
Line 1: | Line 1: | ||
{{extdev}} | {{extdev}} | ||
XMLHttpRequest is a Javascript object that was created by Microsoft and adopted by Mozilla. You can use it to easily retrieve data via HTTP. Despite its name, it can be used for more than just XML documents. | XMLHttpRequest is a Javascript object that was created by Microsoft and adopted by Mozilla. You can use it to easily retrieve data via HTTP. Despite its name, it can be used for more than just XML documents. | ||
==Basic Usage== | |||
Using XMLHttpRequest is very simple. You create an instance of the object, open a URL, and send the request. The HTTP status code of the result, as well as the result document are available in the request object afterwards. | |||
===Example=== | |||
<pre> | <pre> | ||
req = new XMLHttpRequest(); | req = new XMLHttpRequest(); | ||
Line 20: | Line 17: | ||
Note that this example works synchronously, so it will block the user interface if you call this from your javascript. You should not use this in practice. | Note that this example works synchronously, so it will block the user interface if you call this from your javascript. You should not use this in practice. | ||
==Asynchronous Usage== | |||
If you intend to use XMLHttpRequest from an extension, you should let it load asynchronously. In asynchronous usage, you get a callback when the data has been received, which lets the browser continue to work as normal while your request is happening. | |||
===Example=== | |||
<pre> | <pre> | ||
req = new XMLHttpRequest(); | req = new XMLHttpRequest(); | ||
Line 38: | Line 35: | ||
</pre> | </pre> | ||
==Other Properties and Methods== | |||
In addition to the properties and methods shown above, there are other useful properties and methods on the request object. | In addition to the properties and methods shown above, there are other useful properties and methods on the request object. | ||
===responseXML=== | |||
If you load an XML document, the responseXML property will contain the document as an XmlDocument object that you can manipulate using DOM methods. | If you load an XML document, the responseXML property will contain the document as an XmlDocument object that you can manipulate using DOM methods. | ||
===setRequestHeader()=== | |||
This method can be used to set a HTTP header on the request before you send it. | This method can be used to set a HTTP header on the request before you send it. | ||
<pre> | <pre> | ||
Line 56: | Line 50: | ||
</pre> | </pre> | ||
===getResponseHeader()=== | |||
This method can be used to get a HTTP header from the server response. | This method can be used to get a HTTP header from the server response. | ||
<pre> | <pre> | ||
Line 73: | Line 66: | ||
</ol> | </ol> | ||
[[Category: | [[Category:Example code]] [[Category:Javascript example code]] |
Revision as of 00:31, 6 March 2005
This page is part of the extension development documentation project.
Ask your questions in MozillaZine Forums. Also try browsing example code.
Note: development documentation is in process of being moved to Mozilla Development Center (MDC).
XMLHttpRequest is a Javascript object that was created by Microsoft and adopted by Mozilla. You can use it to easily retrieve data via HTTP. Despite its name, it can be used for more than just XML documents.
Basic Usage
Using XMLHttpRequest is very simple. You create an instance of the object, open a URL, and send the request. The HTTP status code of the result, as well as the result document are available in the request object afterwards.
Example
req = new XMLHttpRequest(); req.open('GET', 'http://www.mozilla.org/', false); req.send(null); if(req.status == 200) dump(req.responseText);
Note that this example works synchronously, so it will block the user interface if you call this from your javascript. You should not use this in practice.
Asynchronous Usage
If you intend to use XMLHttpRequest from an extension, you should let it load asynchronously. In asynchronous usage, you get a callback when the data has been received, which lets the browser continue to work as normal while your request is happening.
Example
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);
Other Properties and Methods
In addition to the properties and methods shown above, there are other useful properties and methods on the request object.
responseXML
If you load an XML document, the responseXML property will contain the document as an XmlDocument object that you can manipulate using DOM methods.
setRequestHeader()
This method can be used to set a HTTP header on the request before you send it.
req = new XMLHttpRequest(); req.open('GET', 'http://www.mozilla.org/', true); req.setRequestHeader("X-Foo", "Bar"); req.send(null);
getResponseHeader()
This method can be used to get a HTTP header from the server response.
req = new XMLHttpRequest(); req.open('GET', 'http://www.mozilla.org/', true); req.send(null); dump("Content-Type: " + req.getResponseHeader("Content-Type") + "\n");