上例从请求回来的二进制数据中得到偏移量为x处的字节.有效的偏移量范围是0到filestream.length-1.
查看 使用XMLHttpRequest下载文件 了解详情,查看下载文件.
发送二进制数据
XMLHttpRequest对象的send方法已被增强,可以通过简单的传入一个ArrayBuffer, Blob, 或者 File对象来发送二进制数据.
下例创建了一个文本文件,并使用POST方法将该文件发送到了服务器上.你也可以使用文本文件之外的其他二进制数据类型.
var oReq = new XMLHttpRequest(); oReq.open("POST", url, true); oReq.onload = function (oEvent) { // 上传完成后. }; var bb = new BlobBuilder(); // 需要合适的前缀: window.MozBlobBuilder 或者 window.WebKitBlobBuilder bb.append(\'abc123\'); oReq.send(bb.getBlob(\'text/plain\'));
将类型数组作为二进制数据发送
你可以将JavaScript类型数组作为二进制数据发送出去.
var myArray = new ArrayBuffer(512); var longInt8View = new Uint8Array(myArray); for (var i=0; i< longInt8View.length; i++) { longInt8View[i] = i % 255; } var xhr = new XMLHttpRequest; xhr.open("POST", url, false); xhr.send(myArray);
上例新建了一个512字节的8位整数数组并发送它,当然,你也可以发送任意的二进制数据
监测进度
支持 DOM 的 progress 事件监测之于 XMLHttpRequest 传输，遵循 Web API 进度事件规范 : 这些事件实现了 ProgressEvent 接口。
var req = new XMLHttpRequest(); //上传监听 req.addEventListener("progress", updateProgress, false); req.addEventListener("load", transferComplete, false); req.addEventListener("error", transferFailed, false); req.addEventListener("abort", transferCanceled, 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 } }
注意： 你需要在请求调用 open() 之前添加事件监听。否则 progress 事件将不会被触发。
在上个例子中，progress 事件被指定由 updateProgress() 函数处理，并接收到传输的总字节数 total 和已经传输的字节数loaded ，total是自“Content-Length”头传输的数据的整体长度(字节)。但是如果 lengthComputable 属性的值是 false，那么总字节数是未知并且 total 的值为0，若知道长度则lengthComputable属性为true
progress 事件同时存在于下载和上传的传输。下载相关事件在 XMLHttpRequest 对象上被触发，就像上面的例子一样。上传相关事件在 XMLHttpRequest.upload 对象上被触发，像下面这样：
var req = new XMLHttpRequest(); //下载监听 req.upload.addEventListener("progress", updateProgress); req.upload.addEventListener("load", transferComplete); req.upload.addEventListener("error", transferFailed); req.upload.addEventListener("abort", transferCanceled); req.open();
注意：progress 事件在使用 file: 协议的情况下是无效的。
使用 loadend 事件可以侦测到所有的三种加载结束条件（abort、load、error）：
req.addEventListener("loadend", loadEnd, false);
需要注意的是，没有方法可以确切的知道 loadend 事件接收到的信息是来自何种条件引起的操作终止；但是你可以在所有传输结束的时候使用这个事件处理。
XMLHttpRequest对象在请求的不同阶段触发不同类型的事件，所以它不需要检查readyState属性。
当调用send（）时，触发单个loadstart事件。当正在加载服务器的响应时，XMLHttpRequest对象会发生progress事件，通常每隔50毫秒左右，所以可以使用这些事件给用户反馈请求的进度。
如果请求快速完成，它可能从不会触发progress事件。当事件完成，会触发load事件。
HTTP请求无法完成有3种情况，对应3种事件。如果请求超时，会触发timeout事件。如果请求中止，会触发abort事件。像太多重定向这样的网络错误会阻止请求完成，但这些情况发生时会触发error事件。
对于任何具体请求，浏览器将只会触发load、abort、timeout和error事件中的一个，还有progress事件。
if(\'onprogress\' in (new XMLHttpRequest())){ //检测是否支持progress事件 var request = new XMLHttpRequest(); request.onprogress = function (e) { if(e.lengthComputable){ progress.innerHTML = Math.round(100* e.loaded/ e.total) + \'%\'; } } }