Question

我有这个代码，要么ajax没有正确传输数据，要么我的php无法正常工作。我知道画布正在保存到写入页面的数据。有没有办法将其转换为文件并从javascript中保存？

START JAVASCRIPT：-------------------

＆lt; - 获取canvass元素并转换为数据png - ＆gt;

var canvas = document.getElementById("textCanvas"); 
var img = canvas.toDataURL("image/png");

＆lt; - 结束了画布元素并转换为数据png - ＆gt;

＆lt; - 发送到php文件 - ＆gt;

var onmg = encodeURIComponent(img);
var xhr = new XMLHttpRequest();
var body = "img=" + onmg;
xhr.open('POST', "convertit.php",true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.setRequestHeader("Content-Length", body.length);
xhr.setRequestHeader("Connection", "close");
xhr.send(body);
xhr.onreadystatechange = function () {
   if (xhr.status == 200 && xhr.readyState == 4) {
     document.getElementById("div").innerHTML = xhr.responseText;
   } else {
     document.getElementById("div").innerHTML = 'loading';
     }
   }

＆lt; - END发送到php文件 - ＆gt;

END JAVASCRIPT：-------------------

START PHP：-------------------

$img = $_POST['img']; 
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
file_put_contents('/uploads/file.png', $data);

结束PHP：-------------------

Answer 1

将php更改为--------＆gt;

define('UPLOAD_DIR', 'images/');
$img = $_POST['img'];
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR . uniqid() . 'txtimg.png';
$success = file_put_contents($file, $data);
print $success ? $file : 'Unable to save the file.';

我来自-----＆gt; http://j-query.blogspot.com/2011/02/save-base64-encoded-canvas-image-to-png.html

-cheers工作真棒：）

如何从base64数据字符串javascript保存PNG图像服务器端

1 个答案: