html - HTML5/Canvas - 将 Base64 图像保存到服务器（替换当前图像）

Question

我目前正在试验 HTML5 Canvas。

我目前制作了一个简单的小绘画应用程序，您可以在其中画线等等。

我做到了，所以我可以将图像保存在 base64 中。with var dataUrl = document.getElementById('your-canvas').toDataURL();

我想知道是否可以拍摄该图像，并将其保存到我的服务器（或任何地方）替换/覆盖已经存在的图像。

这样做的目的是将保存的图像作为画布的背景。然后每次有人在画布上绘图并单击保存时，它会将他们的绘图保存为背景图像，以便下一个继续使用它的人可以看到最后一个人绘制的内容。

基本上是一个公共互联网白板。

有人可以告诉我这是否可能，并指出正确的方向（代码语言、教程等）吗？

谢谢。

Answer 1

You can display or save image like this：</p>

$imgData = $_POST['data'];

$imgData = str_replace(' ','+',$_POST['data']);
$imgData = preg_replace('/^data:image\/(png|jpg);base64,/','',$imgData);

header("Content-type: image/png");
echo base64_decode($imgData);