在PHP上将Canvas另存为图像时出现500内部服务器错误

Question

Trying to save Raphael Paper on Server as an Image I have following code:

$(function() {

$("#printBtn").click(function() {

var svg1 = $("#map > svg").get();
var svg = $('#map').html().replace(/>\s+/g, ">").replace(/\s+</g, "<").replace(/<canvas.+/g,"");
// strips off all spaces between tags

canvg('cvs', svg, {        
ignoreMouse: true, 
ignoreAnimation: true
});  
var canvas  = document.getElementById('cvs');
var img = canvas.toDataURL("image/png");
});          
});     

});
</script>

and on my process.php I have :

<?php
$data = substr($_POST['imageData'], strpos($_POST['imageData'], ",") + 1);
$decodedData = base64_decode($data);
fclose();
echo "/canvas.png";

but I am getting 500 Internal Server Error from process.php

Can you please let me know why this is happening and how can I stop it?

Thanks

Answer 1

Your error is coming from the server, not from javascript which runs in the browser. So the problem is in your php script.

There you have a simple syntax error:

data = substr($_POST['imageData'], strpos($_POST['imageData'], ",") + 1);

Should be:

$data = substr($_POST['imageData'], strpos($_POST['imageData'], ",") + 1);
^ here

By the way, when you get 500 errors, you should always check the server error log and / or display errors in php:

ini_set('display_errors', 1);

Possibly combined with something like:

error_reporting(E_ALL | E_STRICT);