问题标签 [fileapi]

是否可以使用 File API 或 HTML5 套件的其他部分将文件捆绑到 zip 文件中？如果是这样，是否有任何示例实现可用？如果不是，那么现代浏览器是否可能在未来一两年内支持这一点？

我们能否将 HTML 的 FileAccess API 与使用 javascript 的文件正常下载集成。

我们通常通过以下方式下载文件：

现在我相信文件会被下载到 tempFolder 和我们指定的下载文件夹。

但是我们是否可以将文件下载到WWC 草案中 HTML 5 File API中提到的沙盒位置。

如果这是可能的，我相信我之前的问题的“需要一种删除下载文件的方法”将得到解决。

我想确保我让用户下载的文档在整个程序中以编程方式进行操作。

我开始知道File API确实为应用程序提供了操作它们的机会。但是我们如何将文件存储在沙盒位置？

无论如何要通过<input type="file" />元素限制文件类型的选择？

例如，如果我只想上传图像类型，我会将可能的选择限制为 (image/jpg,image/gif,image/png)，并且选择对话框会使其他 mime 类型的文件变灰。

ps 我知道我可以通过扫描 .type 属性来使用 File API 执行此操作。我真的想事先限制这一点。我也知道我可以通过 flash 做到这一点，但我不想为此使用 flash。

HTML5 Rocks有一些关于文件上传的好例子，但有些东西对我来说还不够清楚。

据我所知，关于文件切片的示例代码是从文件中获取特定部分然后读取它。正如注释所说，这在我们处理大文件时很有帮助。

关于监控上传的示例还指出，这在我们上传大文件时很有用。

不切片文件我安全吗？我的意思是服务器端问题、内存等。Chrome 目前不支持File.slice()，如果可能的话，我不想使用臃肿的 jQuery 插件。

我有一个blob:blahblah指向文件的blob url。我想将此 blob 后面的文件写入本地文件系统。writer.write()文档说它接受一个文件对象（来自输入类型文件）和一个blob。但是尝试此操作时会引发类型不匹配错误

我知道问题是blob没有被接受，但我想知道如何将 blob 存储到文件系统。我之前在脚本中从 input-type-file 创建了上述 blob，并将其值存储在 var 中。

编辑

好的，所以我认为我应该首先给出更多代码。

首先我创建一个blob url并将其存储在这样的var中

files来自输入类型文件 html 标记，并且 i 循环显示文件数。你知道演出。

然后变量通过多种媒介，首先通过 chrome 的消息将 api 传递到另一个页面，然后从该页面通过 api 传递给工作人员postMessage，最后通过postMessage再次返回父页面。

在最后一页上，我打算使用它通过像这样的文件系统 api 将 blob 的文件存储到本地文件系统。

但是writer.write投掷Uncaught Error: TYPE_MISMATCH_ERR: DOM File Exception 11

我相信这个错误是因为提供给的变量writer.write是文本而不是来自类似createObjectUrl（直接而不是在通过多个页面/范围之后）的 blob 对象，或者不是window.WebKitBlobBuilder. 那么如何使用 blob 的 url 来存储文件呢？

我正在制作一个 html 界面，以通过拖放和多个选择文件在服务器上上传图像。我想在将图片发送到服务器之前显示它们。所以我第一次尝试使用FileReader，但我遇到了一些问题，比如这篇文章。window.URL.createObjectURL()所以我改变了我的方式，我决定像 ebidel 在帖子中推荐的那样使用 blob:urlwindow.URL.revokeObjectURL()来释放内存。

但是现在，我遇到了另一个问题，与此类似。我希望客户可以根据需要一次上传 200 张图片。但是浏览器崩溃了，使用的内存非常高！所以我想可能是同时显示了太多图像，我使用数组设置了一个带有文件等待队列的系统，以便一次只处理 10 个文件。但问题仍然存在。

在谷歌浏览器上，如果我检查chrome://blob-internals/文件（通常已经由window.URL.revokeObjectURL()发布）大约在 8 秒延迟后发布。在 Firefox 上，我不确定，但似乎文件没有发布（我检查了about:memory-> 图像）

我的代码是坏的，还是独立于我的问题？是否有强制导航器立即释放内存的解决方案？如果它可以提供帮助，这是发生问题的 JavaScript 部分：链接已过期，因为代码未包含在问题中。

编辑

这是一种自己的回答 + 对 bennlich 的回答（太长的文字无法评论）

我从 user1835582 的回答中了解到，我确实可以删除 Blob/File，但是当浏览器需要图像时，它会将它们保存在内存中的某个位置（这是合乎逻辑的）。因此，显示图像（很多和沉重）让我崩溃和减速的事实是事实，而不是revokeObjectURL方法。而且，每个浏览器都以自己的方式管理内存，导致不同的行为。这是我如何得出这个结论的。

首先，让我们尝试一下，revokeObjectURL使用https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications#Example.3A_Using_object_URLs_to_display_images的源代码的简单示例。chrome://blob-internals/使用 Chrome，您可以通过检查或尝试将显示的图像打开到一个空白的新选项卡来验证 Blob 是否已被很好地撤销。注意：要完全释放 Blob 引用，请添加document.getElementById("fileElem").value = "". 当我几年前发布我的问题时，释放 blob 大约需要 8 秒，现在几乎是立即的（可能是由于 Chrome 的改进和/或更好的计算机）

然后，是时候进行充电测试了。我用一百张大约 2.5 个月的 jpg 来做这件事。显示图像后，我滚动了页面。Chrome 崩溃并且 Firefox 很慢（未在其他浏览器上测试）。然而，当我评论li.appendChild(img)一切顺利时，即使有一大堆图像。这表明问题不是来自revokeObjectURL实际上工作正常的方法，而是来自显示大量重图像。您还可以测试创建一个包含数百张重图像的简单 html 页面并滚动它 => 相同的结果（崩溃/减速）。

最后，为了更深入地了解图像内存管理，在 Firefox 上查看 about:memory 很有趣。例如，我看到当窗口处于活动状态时，Firefox 解压缩图像（图像 -> 未压缩堆上升），而原始（图像 -> 原始）始终是稳定的（相对于加载的图像数量）。这里有一个关于内存管理的很好的讨论：http: //jeff.ecchi.ca/blog/2010/09/19/free-my-memory。

如您所知，HTML 5 提供了一个不错的 FileAPI。我建立了一个系统，用户接收 Base64 编码的字符串，需要写入磁盘（具有适当的权限，因为它是 Google Chrome 应用程序）。我的代码如下：（清除了一些不必要的东西）

但是，我的原始文件大小是：6302446 字节，服务器将它们作为 Base64 以 8403264 字节发送，但是保存的文件是 9242715 字节。当然，我知道出了点问题，我查看了文件，它只是一个不错的字符串。没有花哨的字符出现。我假设我以文本模式编写，而 atob 只是将其转换为另一个字符串；我需要将其转换为二进制格式（也许在数组中？）并强制我的 fileWriter 以二进制模式而不是文本模式写入。我在网上搜索过，但找不到解决方案。我在 StackOverflow 上发现了这个问题Google Chrome Base64 方法是否能够处理来自 File API 的二进制数据？但这对我没有帮助。

如何将我的 Base64 字符串转换为正确的数据结构并让我的 fileWriter 编写它？

我需要将一些数据保存在文件中，并且在加载页面时我想读取此文件并将此数据添加到页面中。我不知道为什么，但是这个分配是无用的，所以我们不能使用数据库或服务器的东西，所以我必须保存并从本地文件中读取。

我在网上搜索，发现不允许直接从javascript访问文件，但使用 HTML5 中的FileAPI我可以选择要读取的文件。

所以我的问题是这是如何完成的，因为没有关于这个的资源，我只需要读取一个文件并进入一个字符串。谢谢，

像谷歌图片一样，我想获得已经加载到浏览器中的 html 页面的拖放图像的功能。我知道有一些脚本实现了 htm5 文件 API，但没有一个能识别浏览器内的图像。如何得到它？