HTML5 将画布保存到服务器上的文件答案

【问题标题】：HTML5 save canvas to file on serverHTML5 将画布保存到服务器上的文件
【发布时间】：2010-12-08 03:47:00
【问题描述】：

我需要使用 html5 画布创建一个组件，该组件提供用户可以在其上绘制的图像并直接（通过一种保存按钮）将其自定义版本上传到服务器上。

我可以使用 html 画布吗？有什么建议吗？

提前谢谢

【问题讨论】：

【解决方案1】：

您可以像这样将图像作为 data-url 获取：

var dataUrl = document.getElementById('your-canvas').toDataURL();

然后您可以将此（非常长的字符串）发送到服务器并在解码后将其保存到文件中（它以 base64 编码）。

编辑：记得按照 cmets 中的建议通过 POST 提交。 GET 在各种浏览器中都有一些长度限制，因此它可能会在数据量如此巨大的情况下超过这些限制。

【讨论】：

【解决方案2】：

请注意，目前这对于 Android（直到并包括 2.3）是死机。请对此问题加注星标 - http://code.google.com/p/android/issues/detail?id=7901

【讨论】：