javascript - 存储/检索 html 5 文件对象以恢复损坏的文件上传

标签 javascript html file-upload cookies local-storage

我正在尝试使用 javascript 和 HTML 5 构建文件上传浏览器客户端。从网页中的文件输入表单(输入类型"file"),浏览器提供带有 html 5 文件对象( http://www.w3.org/TR/FileAPI/ )的文件句柄。上传是使用此文件对象完成的。但我希望在上传未完成时恢复文件上传。为此,我需要在尝试恢复上传时使用 File 对象。 cookies和html 5 localstorage仅存储原始数据类型而不是对象。有没有办法存储/检索文件对象,或者从对象中提取实际的文件句柄,存储它并使用其构造函数创建文件对象。

服务器将维护上传状态,客户端唯一需要做的就是存储和检索该文件对象。对客户端代码有什么建议/解决方法吗?

最佳答案

存储在locastorage中的数据需要是原始数据类型,并且您需要在将数据保存到此处之前对其进行序列化。由于File对象不是原始数据类型之一,因此您无法将其保存到localstorage。不要忘记,它们对可以保存在本地存储中的最大数据有限制(5MB),对于 cookie 来说甚至更少。因此,使用上述选项不可能

但是,使用 HTML5 文件 API 可能是一种选择,或者您可以查看 indexedDB。我没有尝试过它们,您在使用它们时可能会发现它们自己的局限性。

这里发现两个类似的问题,你可以看看

Is it possible to save a File object in LocalStorage and then reload a File via FileReader when a user comes back to a page?

How do I save and restore a File object in local storage

关于javascript - 存储/检索 html 5 文件对象以恢复损坏的文件上传,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19899567/

相关文章:

javascript - Redux 持久化 : some part of state not being persisted

Javascript在循环中隐藏对象

javascript - HTML/Javascript 在 onclick 中使用 src 字符串而不需要重新输入?

ruby-on-rails - 从 Elastic Beanstalk 上托管的 Rails 应用程序上传文件的问题

javascript - 在Javascript中将随机选择的类添加到相同id的div中

java - Android 上的 webGL 替代品

javascript - 在窗口调整大小时调用多个函数

css - Zurb Foundation 3 - 全宽部分和更改最大宽度?

html - chrome 文件输入宽度

c# - ASP.NET MVC/WEB API 文件上传 : Memory not being deallocated after upload