The implementation of XMLHttpRequest in Firefox 3.1/3.5 has been improved.

As a web developer, you should care, among other things, about two new features:

  • monitoring progress (doc here)
  • Cross-site HTTP requests (doc here)

Monitoring progress

XHR now provides a new event: progress. That means you can track the progress of your request (like the percentage of a download). It's easy to use:

var req = new XMLHttpRequest();  
req.addEventListener("progress", updateProgress, false);  
req.open();  
// progress on transfers from the server to the client (downloads)  
function updateProgress(evt) {  
 if (evt.lengthComputable) {  
    var percentComplete = evt.loaded / evt.total;  
    // ...
  } else {  
    // Unable to compute progress information
    // since the total size is unknown  
  }  
}

Cross-site HTTP requests

This is a really new cool feature. You can now do a request from you web page to a different domain. But the remote content targeted should provide an Access-Control (through a HTTP header - .htaccess, PHP, ... - or a XML header). See MDC for more informations: https://developer.mozilla.org/En/HT....

Example of a .htaccess:

<FilesMatch "foobar.xml">
  Header set Access-Control-Allow-Origin "http://www.mozbox.org"
</FilesMatch>

The demo

XHR

This demo includes these two new features. A XHR is performed from my website (www.mozbox.org) to the Mozilla website (people.mozilla.com). The XHR downloads a big file (5.4Mo).

  • the progress of the download is displayed via a canvas progress bar (a <canvas/> progressbar: http://www.netzgesta.de/gauge/)
  • the request is allowed because I add a header via a .htacces: Header set Access-Control-Allow-Origin "http://www.mozbox.org"

Try it :)