Php 使用AJAX发送图像数据并存储在服务器上
PHP并没有从ajax接收数据,我正在尝试使用canvas HTML5创建图像,并使用PHP将其存储在我的服务器上,但当我这样做时,我什么都没有收到 image.php:Php 使用AJAX发送图像数据并存储在服务器上,php,ajax,html,canvas,Php,Ajax,Html,Canvas,PHP并没有从ajax接收数据,我正在尝试使用canvas HTML5创建图像,并使用PHP将其存储在我的服务器上,但当我这样做时,我什么都没有收到 image.php: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <canvas width="800" height="420" id="canvas"></canvas&
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<canvas width="800" height="420" id="canvas"></canvas>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var img = loadImage('images/quizes/sim.png' ,main);
var img1 = loadImage('images/users/alfred.jpg', main);
var img2 = loadImage('images/users/brynjar.jpg', main);
var imagesLoaded = 0;
function main() {
imagesLoaded += 1;
if(imagesLoaded == 3) {
ctx.drawImage(img, 0, 0, 800, 420);
ctx.drawImage(img1, 0, 0, 320, 320);
ctx.drawImage(img2, 480, 0, 320, 320);
}
}
function loadImage(src, onload) {
var img = new Image();
img.onload = onload;
img.src = src;
return img;
}
var dataURL = canvas.toDataURL();
alert(dataURL);
$.ajax({
type: "POST",
url: "script.php",
data: {
imgBase64: dataURL
}
}).done(function(o) {
console.log('saved');
// If you want the file to be visible in the browser
// - please modify the callback in javascript. All you
// need is to return the url to the file, you just saved
// and than put the image in your browser.
});
</script>
但是当我运行image.php时,$\u post['data']不会拾取任何数据。您应该从
$\u post['imgBase64']
变量中读取数据。尝试读取$\u post['imgBase64']
变量。如果它为空或不存在,请在此处提供var\u dump($\u POST)
的结果。Tanks,我曾经阅读过$\u POST['imgBase64']
$img = $_POST['data'];
$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);