使用 javascript 中的数据链接下载大文件时出错答案

【问题标题】：Error when downloading a large file using data link in javascript使用 javascript 中的数据链接下载大文件时出错
【发布时间】：2020-03-03 19:05:05
【问题描述】：

我的网页有一个包含大约 10,000 行的表格。我使用 tabletoJson npm 包将 html 表格数据转换为 JSON 对象。现在要将此对象写入 json 文件并下载相同的文件，我正在执行以下操作。

HTML

<a id="json_gene" href="" download="tgen_json.json">
  <button id="bmss" type="button" class="btn btn-primary exscel">Download Json</button>
</a>

$("body").on("click", "#json_gene", function () {
  var table = $('#data_table').tableToJSON();
  table = {"data": table};
  table = JSON.stringify(table)
  this.href = "data:text/plain;charset=UTF-8,"  + encodeURIComponent(table);
});

当表的行数约为 8000 行时，将下载 json 文件。但是当它超过 10000 行时，json 文件无法下载，因为 很多数据被附加到 url 本身，因为我认为它也有一个特定的限制。

请为此 json 下载建议替代方案。

【问题讨论】：

一次查看10,000条记录对用户真的有用吗？
是的，它也是一个可编辑的表格。所以，它需要
使数据可编辑并不意味着所有数据都必须可用。显示数据的典型做法是显示一个子集，例如通过分页，它允许用户细化/查找他们正在寻找的内容。不要向他们展示大量文字。
我理解您的观点，我尝试将其设为数据表，但问题是当有分页时，只有前几行被下载，其余行丢失

标签： javascript jquery json get

【解决方案1】：

您可以使用URL.createObjectURL api 创建虚拟文件链接。

$("body").on("click", "#json_gene", function() {
  var blobPart = [$('#data_table').tableToJSON()];
  var blob = new Blob(blobPart, {
    type: "application/octet-stream"
  });
  var urlObj = URL.createObjectURL(blob);
  this.href = urlObj;
});

【讨论】：

不错！刚刚用包含 100.000.000 个字符 (97MB) 的数据对此进行了测试，它works
哇!!!!....这很好用....非常感谢@Misir
希望对您有所帮助:)