上传从画布创建的图像
上传从画布创建的图像
提问于 2017-03-12 21:12:51
我正在尝试从画布元素创建一个img对象，并将图像上传到服务器：
var img = new Image();
img.src = c2.toDataURL("image/jpeg", 0.95); // c2 is the canvas element
var formData = new FormData();
formData.append('img', img);
$.ajax({
url: 'pro01.php',
cache:false,
contentType: false,
processData: false,
type: 'post',
data: formData,
success: function(data) {
console.log(data);
}
});pro01.php
$img = $_FILES['img'];
$target_dir = "images/";
$target_file = $target_dir . basename($_FILES["img"]["name"]);
move_uploaded_file($_FILES["img"]["tmp_name"], $target_file);控制台：<b>Notice</b>: Undefined index: img in...
有什么帮助吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-03-12 21:26:27
相反，只需将画布转换为base64，就可以使其成为图像。
var canvas = document.getElementById('myCanvas');
var dataURL = canvas.toDataURL();现在发送它：
$.ajax({
type: "POST",
url: "pro01.php",
data: {
imgBase64: dataURL
}要在php中接收它(pro01.php)：
从post请求中获取它，删除start并对post值调用base64_decode()：
$img = $_POST['imgBase64'];
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$fileData = base64_decode($img);
//saving
$fileName = 'photo.png';
file_put_contents($fileName, $fileData);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42753223
复制相关文章
相似问题
腾讯云开发者
