无法使用 JavaScript 下载大型数据

Question

我有一个大的JSON对象数据，在JavaScript中。我已经使用JSON.stringify()将其转换为字符串。现在我的用例是将这个大字符串提供给用户以文本文件的形式。因此，我编写了以下代码。

HTML代码：

  <button id='text_feed' type="submit">Generate ION Feed</button>

  <a href="data:attachment/txt" id="textLink" download="feed.txt"></a>

Javascript 代码

 var text = //huge string  

 $("#text_feed").click(function() {
        _generateFeed(text);
 });

 var _generateFeed = function(text) {
    //some code here
    $("#textLink").attr("href",
                          "data:attachment/txt," + encodeURIComponent(text))  [0].click();
    });
 }; 

问题: 当字符串长度较小时，我可以下载数据。但是当字符串长度变大 (> 10^5)，我的页面崩溃了。 这是因为 "encodeUriComponet(text)" 无法编码大量数据。

我还尝试过 window.open("data:attachment/txt," + encodeURIComponent(text));， 但是我的页面再次崩溃，因为同样的原因，encodeURIComponet 无法编码如此大的字符串。 另一种方法: 我也考虑通过使用HTML5文件写入API将数据写入文件，但它仅在Chrome Web浏览器中支持，但我需要使其运行至少在Firefox和Chrome两个浏览器上都能用。 用例 我不想通过分割数据来进行多次下载，因为最终我需要将数据保存在一个文件中。

我的目标是支持大约10^6长度的字符串。请问有人可以帮我下载/写入这么大量的数据到一个单独的文件中吗？

- ankur37

---

URL.createObjectURL(new Blob(text, {type: 'text/plain'})); 这个能用吗？ - CodingIntrigue

这是一个演示：http://jsfiddle.net/efLfqp3f/。Blob编译1兆字节的文本就像没什么事一样。 - Sebastian Simon

@RGraham和Xufox，谢谢。 这对我很有效 :) - ankur37

我解决了这个问题，如下所示。 var _generateFeed = function(text) { /*在这里插入一些代码*/ var url = URL.createObjectURL( new Blob( [text], {type:'text/plain'} ) ); $("#textLink").attr("href",url)[0].click(); }; - ankur37

你的服务器是哪一个？也许是一个 ExpressJS 服务器？它对 JSON 文件有限制。 - Alejandro Teixeira Muñoz

Answer 1

来自原帖

I solved it as below.

var _generateFeed = function(text) {
    /*some code here*/
    var url = URL.createObjectURL( new Blob( [text], {type:'text/plain'} ) );
    $("#textLink").attr("href",url)[0].click();
}; 

注意：

• URL.createObjectURL() 兼容现代浏览器和IE10+，但它是一项不稳定的实验性技术。
• 使用 URL.createObjectURL() 创建的对象 "必须通过调用 URL.revokeObjectURL() 进行释放" - MDN

- JDB