javascript - 本地存储和本地文件

Question

我们计划在 HTML5 中创建图像处理服务。一个目标是该服务适用于匿名用户。

• 用户添加图像(打开文件对话框/拖放)
• 用户在浏览器中操作图像
• 用户保存结果

现在，这里的技巧是浏览器可能随时在我们下面死掉(用户存在，笔记本电脑电池没电等......)我们希望在这里有某种自动保存来记录进度.这意味着跟踪添加到页面上的图像，最好以离线方式。

问题是，我们能否以某种方式在本地自动保存用户在页面上添加的文件和图像，或者我们是否强制让用户重新输入他/她在页面上添加的所有图像，在案例页面中必须是重新加载？ localStorage 是否支持本地文件对象或引用？

Answer 1

是的，您可以实现自动保存功能。

您可以使用 HTML5 Canvas API 让用户在浏览器中操作图像。然后你可以使用toDataURL方法获取图像的数据URL。获取后，您可以将其保存到本地存储。我们现在可以只将字符串保存在本地存储中。 Spec说对象可以保存在本地存储中，但大多数浏览器不支持。

使用setInterval方法可以定时保存图片。