如何保存window.URL.createObjectURL（）结果以供将来使用？

我在HTML5中制作应用程序，在其中选择视频文件，然后应用程序使用HTML5 video标记和window.URL.createObjectURL()播放它。问题是，我要救这个视频在localStorage的数据，并在用户使用我的应用程序再次发挥它，但作为Mozilla MDN states这个方法的结果：如何保存window.URL.createObjectURL（）结果以供将来使用？

浏览器会自动释放这些文档时被卸载

那么有可能做我想做的事吗？或者在没有window.URL.createObjectURL()的情况下做同样的事情，但要做其他事情？

来源

2011-09-29 Cokegod

我没有使用createObjectURL()，但如果我理解正确，它实质上是对文件或内存中对象的临时引用。如果您想保存实际的视频，它将不会有用，因为下次用户访问该应用程序时，该视频本身将不再被该指针引用。

我认为您或许可以用data:这个URL代替URL，因为这个URL实际上包含了文件中的全部数据。 This example演示使用FileReader来生成数据URL。我想你应该能够做到这一点：

var reader = new FileReader(); 
reader.onload = function(e) { 
    var myDataUrl = e.target.result; 
    // do something with the URL in the DOM, 
    // then save it to local storage 
}; 
reader.readAsDataURL(file);

更新：如果你想去高达1GB，为您在您的评论请注意，你可能会得到更好的利用FileSystem API服务。这需要您获取本地文件，将文件的副本保存到永久文件系统存储，然后使用createObjectURL()获取文件副本的URL。磁盘空间仍然存在问题 - 您只需将1GB的重复文件内容添加到用户的文件系统中，但我认为不可能在浏览器沙箱外持续引用文件。

来源

2011-09-29 22:33:57 nrabinowitz

这与createObjectURL（）不同，因为createObjectURL（）只链接到用户计算机中的文件，而使用FileReader它将文件的所有数据放入内存中。这对于图片非常有用，因为它们并不重要，但我计划用户使用我的应用程序播放的视频可能会达到1GB，并且您不希望所有这些内容在已经存在的情况下进入您的内存保存在你的机器上...... – Cokegod

对，但我不认为'createObjectURL（）'提供了一个*持久*参考文件 - 这就是为什么当页面被卸载时它被撤销。允许持续引用文件 - 例如通过文件路径 - 将是一个安全问题。这就是为什么我建议你需要保存整个事情。 – nrabinowitz

您可以将无限数据写入FileSystem API（并通过指定'window.PERSISTENT'来保持它的持久性）。 'window.requestFileSystem（window.TEMPORARY，10 * 1024 * 1024/* 10 MB * /，onInitFs，errorHandler）' [请参阅html5Rocks教程]（http://www.html5rocks.com/en/） tutorials/file/filesystem /）只需设置您希望使用的数据量。 –

如何保存window.URL.createObjectURL（）结果以供将来使用？

回答

相关问题