使用FileAPI下载生成的大数据文件

时间:2013-05-13 13:11:48

标签: javascript fileapi

JavaScript进程生成大量数据(200-300MB)。我想保存这些数据以供进一步分析,但到目前为止我发现的最好的是保存使用这个示例http://jsfiddle.net/c2U2T/,这对我来说不是一个选项,因为它看起来需要所有数据可用之前开始下载。但我需要的是像

var saver = new Saver();
saver.save(); // The Save As ... dialog appears
saver.onaccepted = function () { // user accepted saving
    for (var i = 0; i < 1000000; i++) {
        saver.write(Math.random());
    }
};

当然,而不是Math.random()将是一些有意义的构造。

2 个答案:

答案 0 :(得分:1)

你实际上要做的是一种流媒体。我的意思是FileAPI不适合这项任务。相反,我可以提出两个选择:

第一个,使用XHR工具,即ajax,通过将数据拆分成几个块,这些块将按顺序发送到服务器,每个块在其自己的请求中连同id(用于标识流)和位置索引(用于识别块位置)。我不建议这样做,因为它增加了分解和重新组合数据的工作,并且因为有更好的解决方案。

实现这一目标的第二种方法是使用Websocket API。它允许您在生成数据时按顺序将数据发送到服务器。遵循通常的流API。我想你肯定需要这个。

此页面可能是开始的好地方:http://binaryjs.com/

这就是所有人!

编辑考虑您的评论:

我不确定是否能完全理解你的观点,但是,HTML5的FileSystem API呢?

这里有几个示例:http://www.html5rocks.com/en/tutorials/file/filesystem/其中包含允许您将数据附加到existant文件的示例。您还可以创建新文件等:

function onInitFs(fs) {

  fs.root.getFile('log.txt', {create: false}, function(fileEntry) {

    // Create a FileWriter object for our FileEntry (log.txt).
    fileEntry.createWriter(function(fileWriter) {

      fileWriter.seek(fileWriter.length); // Start write position at EOF.

      // Create a new Blob and write it to log.txt.
      var blob = new Blob(['Hello World'], {type: 'text/plain'});

      fileWriter.write(blob);

    }, errorHandler);

  }, errorHandler);

}

编辑2:

如SO here所述,使用javascript无法实现您的目标。尽管如此,Tha作者建议使用Java Applet来实现所需的行为。

简而言之,HTML5 Filesystem API仅提供沙盒文件系统,即位于浏览器的某个隐藏目录中。因此,如果您想访问真正的文件系统,考虑到您的用例,使用java会很好。我想java和javascript here之间有一个接口。 但是,如果您只想从浏览器中获取数据(受同源策略约束),请使用FileSystem API。

答案 1 :(得分:1)

@dader - 我会建立在dader的例子上。

  1. 使用HTML5 FileSystem API - 但不是每行都写入文件(比其值更多的IO),你可以在javascript对象/数组/字符串中批量处理内存中的一些行,并且只写它当文件达到某个阈值时到文件。因此,您将附加到本地文件作为进程突出显示(可以轻松暂停/重新启动/停止等)
  2. 值得注意的是以下内容,该示例说明如何生成dialoge以请求您需要的数据量(听起来很大)。用铬测试:

    navigator.persistentStorage.queryUsageAndQuota(
    function (usage, quota) {
      var availableSpace = quota - usage;
      var requestingQuota = args.size + usage;
      if (availableSpace >= args.size) {
        window.requestFileSystem(PERSISTENT, availableSpace, persistentStorageGranted, persistentStorageDenied);
      } else {
        navigator.persistentStorage.requestQuota(
            requestingQuota, function (grantedQuota) {
              window.requestFileSystem(PERSISTENT, grantedQuota - usage, persistentStorageGranted, persistentStorageDenied);
            }, errorCb
          );
      }
    }, errorCb);
    
  3. 完成后,您可以使用Javascript打开一个新窗口,其中包含您保存的blob对象的URL,您可以通过以下方式检索该文件:fileEntry.toURL()

  4. 或者 - 当它完成处理时,您只需在html链接中显示该URL,然后他们就可以右键单击它并按照他们想要的方式执行任何保存链接。
  5. 但这是一个新的和酷的东西,你可以完全在浏览器中完成,而不需要以任何方式涉及服务器。旁注,Javascript过程生成的200-300MB数据听起来非常庞大...这对于您是否存储“正确”数据而言将是一个问题......