Javascript 使用大数据处理XMLHttpRequest响应

使用Chrome，我设置了一个

XMLHttpRequest

：

const xhr = new XMLHttpRequest();
xhr.open(method, url, true);
...
xhr.onreadystatechange = () => {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      if (isStatusCodeSuccess(xhr.status)) {
        // handle response;
      } else {
        // handle error
      }
    }
};
xhr.addEventListener('progress', event => {
    console.log(event.loaded, event.target.response.length);
});
xhr.send(data);

在某些时候，我请求一些JSON数据，其总大小约为295MB未压缩/5.8MB压缩。不幸的是，当成功调用以下代码时，响应是空字符串

使用progress事件监听器，我可以看到响应在某一点上被正确地逐块处理。以下是它生成的控制台日志摘录：

32768 32768
4639135 4639135
7376739 7376739
11525403 11525403
...
261489180 261489180
264684030 264684030
267880247 267880247
271037819 0
274232442 0
277428774 0
...
304018210 0
309230213 0
310445469 0

Chrome上似乎有字符串/分配限制，但我没有收到任何错误

在firefox上，我收到以下错误：

InternalError:allocation size overflow

我尝试存储结果，但无法“清空”Xml Http请求对象，因为属性是只读的

浏览器中变量的官方限制是什么？我找不到官方答案，只是一些实验性的答案

除了使用WebSocket之外，还有什么方法可以解决这个问题并处理大量的帖子结果吗？

我在想：

• 数据流的特定内容类型，如

  应用程序/octet流

• 用于按块处理数据的特定参数，如标头，尽管我获取的内容不是静态的（它随时间而变化）
• 已知的减少JSON响应长度的算法，我可以逐块解压数据以避免达到上述限制

您可以尝试使用，这是XMLHttpRequest的一个改进版本，直接使用promises。它附带了一个功能，可以流式传输响应正文，而不是将整个正文响应缓冲为文本

基本上，使用

progress

事件，会对每个块调用您，但xhr响应会不断将响应累积为文本，从而达到内存限制

使用

获取API

，您可以在收到字节时读取它们：

const consume = responseReader => {
    return responseReader.read().then(result => {
        if (result.done) { return; }

        // do something with the current chunk
        const chunk = result.value;

        return consume(responseReader);
    });
}

// Perform the request and consume response stream
fetch(url).then(response => {
    return consume(response.body.getReader());
})
.catch(console.log.bind(console));

有关更多信息，请参阅本文：

---

只有在编写时，Chrome 43和Edge 14才支持通过Fetch API流式传输响应正文。Cf.

您是否尝试过以

Blob

的形式请求数据？这是太多的JSON，请将其分解为更小的部分，否则无法解析它。请记住，大多数js引擎的内存只有0.5-1.0gb，因此以unicode格式存储256mb字符串会消耗掉一半的ram，然后将其解析为对象也会占用大量ram，结果对象也是如此。