javascript - 为什么使用 ProgressEvent 对象调用加载事件？

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
});

这是一个 fiddle :https://jsfiddle.net/08zm9urL/1/

另请注意:

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

If responseType is set to anything other than the empty string or "text", accessing responseText will throw InvalidStateError exception.

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