Question

我正在尝试在浏览器中异步加载二进制数据：

var req = new XMLHttpRequest();
req.open("GET", "test.bin");
req.responseType = "arraybuffer";
req.addEventListener("load", function(res) {
   var arrayBuffer = res.response; // Note: not oReq.responseText
   ...

但是被触发的加载事件的res对象是ProgressEvent。

这是正常的吗？我正在使用chrome并在MDN上阅读文档： https://developer.mozilla.org/en/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest

为什么文档错了？这应该跳过进度事件，不是吗？

Answer 1

文档没有错，你也不是。响应对象是load事件的ProgressEvent。为了获得对响应的访问权限，您需要在您的案例中指回原始请求（req）。

var req = new XMLHttpRequest();
req.open("GET", "test.bin");
req.responseType = "arraybuffer";
req.addEventListener('load', function(progress) {
  var arrayBuffer = req.response;
});

ProgressEvent还可以通过currentTarget访问来源。例如：

req.addEventListener("load", function(progress) {
  var arrayBuffer = res.currentTarget.response
});

这是一个小提琴：https://jsfiddle.net/08zm9urL/1/

同时注意：

responseText为responseType时，您无法访问arraybuffer。它必须是空字符串或text。

如果responseType设置为空字符串或＆＃34; text＆＃34;以外的任何内容，则访问responseText将引发InvalidStateError异常。

来自https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/responseText

Answer 2

req.onload用于处理响应，req.addEventListener("load", ...用于监控进度，如文档中所述。

为什么使用ProgressEvent对象调用load事件？

2 个答案: