解码画布todataURL

Question

我在使用canvas的todataurl()方法创建的数据时遇到了困难.目前我的代码将结果数据发送到我的php服务器,该服务器使用file_put_contents()方法创建一个文件来存储该数据.现在,如果我将文件中产生的乱码剪切并粘贴到图像标签src中,它可以正常工作并正确显示,所以我假设到目前为止一切都很好.

但是当我尝试在JS中使用代码时,我一直遇到问题.我已经尝试过php的base64_decode方法,但不断收到破坏的文件.我找到了这段代码:

<?php
  $encodedData = str_replace(' ','+',$encodedData);
  $decocedData = base64_decode($encodedData);

并且仍然有被破坏的文件.理想情况下,我想用它创建一个.png文件,但我决定只在JS中再次处理数据文件.任何帮助非常感谢.

Answer 1

看来你必须摆脱toDataURL()函数前面的图像数据头.在客户端,您可以像这样剥离标题:

..
var data=canvas.toDataURL();
var output=data.replace(/^data:image\/(png|jpg);base64,/, "");
// now send "output" to the server
..

在服务器端使用此:

<?php
    $decocedData = base64_decode($encodedData);
?>