HTML5离线应用程序中的文件上载

我正在开发一个基于Web的应用程序，该应用程序可能会在Internet连接不稳定的环境中使用。我将它实现为一个HTML5离线应用程序，它将利用HTML5本地存储（实际上是jQuery插件jStorage）。这是一个数据输入驱动的应用程序，因此脱机时创建的所有新条目都保存在本地存储中，并将在以后重新建立互联网连接时与服务器同步。我几乎做到了这一点，但现在我面临一个要求，即用户实际上需要在提交数据输入的同时上传一个图像。
我发现了这个HTML5 API规范，它涉及文件上传和脱机访问。在我深入讨论这个问题之前-这个功能有什么包装可以简化我的工作吗？
我还发现了这篇文章-它利用了一个公开的TwitPic API，我想从这里的人们那里得到一些专业的反馈。

---

谢谢大家!

不久前我写了一篇关于HTML5文件API的文章-

---

也可以参考GitHub回购-以了解高级控制。

我知道我问这个问题已经有一段时间了，但我仍然看到这个问题受到了支持和支持，所以我想我将分享我最终如何解决这个问题。

---

在我的例子中，文件并没有那么大，所以我决定对它们进行MIME编码，然后将字符串存储在HTML5 localStorage中。它很有魅力。

我不认为

localStorage

是正确的答案，因为

localStorage

只保存字符串，并且有5兆字节的存储限制

我建议像

但是如果您坚持使用

localStorage

，那么Mozilla Hacks有一篇关于在

localStorage

中存储图像的文章：

indexedDB

可能是存储文件的更好地方：

---

我不太清楚我是否理解你的意思。无法脱机将文件上载到服务器。时期您链接到的演示必须保留文件并等待连接，但没有神奇的方法可以避免脱机。@RaymondCamden-这正是我要找的-将文件（或其内容）保留在某个位置，直到连接再次可用。我正在编写一个“偶尔连接”的应用程序，它不能依赖于连接随时启动。它在HTML5本地存储中“缓存”未同步的记录，并在连接可用时与服务器同步。我只是想知道如何用文件来实现这一点。更多的细节会很方便。介绍了图像，但这应该是一个很好的例子，说明如何执行此答案中大致描述的操作。Hi@insiderpro，那么您将图像保存到本地存储，以后如何将其推送到服务器？作为base64？10x@Bill，是的，我将它们作为base64字符串推送到服务器。嗨@insiderpro谢谢。你能分享一些如何转换成base 64的例子吗？@Bill，我的解决方案是一个信息亭，所以我可以控制使用哪个浏览器。这可能与所有浏览器兼容，也可能与所有浏览器不兼容。函数readImage（input）{if（input.files&&input.files[0]）{var FR=new FileReader（）；FR.onload=function（e）{$（'#job thumb'）.attr（'src'，e.target.result）；$（'#job thumb'）.attr（'data-mime'，e.target.result）；}；FR.readAsDataURL（input.files[0]）}$(“#myfile”）.change（函数（）{readImage（this）；}）；