不间断的ajax请求答案

【问题标题】：Uninterruptable ajax request不间断的ajax请求
【发布时间】：2013-12-31 09:43:24
【问题描述】：

有时我必须 AJAX 一个巨大的 JSON 有效负载 (~20MB)。在此过程中，浏览器窗口似乎在不断加载（最新的 Chrome、Windows 8.1）。用户可以单击诸如链接之类的东西，但在 AJAX 请求完成之前，浏览器实际上不会转到这些链接。这可能是一个问题，因为如果您转到需要此类 AJAX 调用的页面，则很难导航离开。不幸的是，此时我无法大幅减少有效负载的大小（我正在加载图表，有时图表有数十万个节点和边）。

知道为什么浏览器不会离开（即使浏览器是响应式的）？并且，如果可能的话，任何潜在的解决方案？谢谢！

【问题讨论】：

你有没有想过把你的 JSON 分成几块？您也可以考虑通过 BinaryJS 之类的东西进行流式传输，并使用允许“流式传输 JSON”的扩展之一，您可以在继续下载的同时访问已解析的 JSON 对象的元素。
你在使用同步ajax吗？如果是这样，停止这样做。
考虑：* 对 JSON 进行分块 * 当数据大于 X 时打开一个单独的页面进行上传 * 以更节省大小的格式上传？
是的，我考虑过这些事情。我更想知道是否有人知道它为什么会发生。因此，当在本地 ajax'ing 这么大的文件时，请求完成时会出现非常小的缓慢。在网络上，这种缓慢似乎被拉长了，这让我相信浏览器正在处理多个“请求”的有效负载，每个“请求”的开销都比我的本地机器更大。只是一个想法。
也许您可以选择尝试使用 g-zip 压缩返回的 JSON。如果它是可能的。或任何用于返回 JSON 的压缩系统。

标签： javascript ajax google-chrome

【解决方案1】：

我不知道如何解决您所面临的确切技术问题。但是，这仍然很有用。考虑使用 Google 或 Facebook，您可以在其中下载您的完整个人资料作为包含所有历史记录和照片的存档。记下他们是如何做到的（不是通过 AJAX 调用）。我相信他们选择这种方式是因为您遇到的问题非常相似。只是想一想。

【讨论】：

【解决方案2】：

几个月前我遇到了类似的问题。我找到了一个使用setTimeout() 的解决方案，它在浏览器事件队列中创建了一个单独的事件。这基本上就是我所做的：

jQuery(document).ready(function() {

  setTimeout(function () {

    $.ajax({
      url: "/longAjaxCall",
      dataType: "json"
    }).done(function() {
      // do whatever ...
    });

  }, 0);

});

不确定你是否使用 jQuery，但不管基本原理是一样的。

【讨论】：

【解决方案3】：

我建议使用HTML5 Web Worker。浏览器支持不是很好，尤其是IE。

Web Worker 是非阻塞的，这意味着您可以同时运行两个脚本。当您在后台进行 AJAX 调用时，这应该会释放您的 DOM。

Here is one article I could find on using web workers with an AJAX call.

【讨论】：

【解决方案4】：

我最初会发送一个MD5 sum 和一个chunk number 来将数据分成块。我会制作一个js 脚本，慢慢地要求他们。然后加入它，稍后检查是否正确发送了完整的数据，最后使用它。

【讨论】：

【解决方案5】：

我能想到的唯一两件事是，就像上面已经说过的许多人一样，您的 AJAX 调用不是异步的，或者您可能已经用完了该浏览器可用的所有并行 http 连接线程。 AJAX 调用阻止了一个，因此取决于您允许用户执行的其他交互，您很可能只是卡在后台下载图像和脚本，并有效地阻止用户继续前进，直到其中一个完成。

20 MB 确实是一大块，所以我也同意其他人的观点，如果可能的话，也许你应该探索实现你需要的替代方法。

【讨论】：