I’m using html2canvas to create an image and put it into “#output’ element and that works as intended, but I would also like to save that image on my server but that I can’t get to work.
Here is how I’m trying to do that:
// HTML2Canvas script
function convert() {
$("#output").empty();
const original = document.querySelector('#input')
const canvasContainer = document.querySelector('#output')
html2canvas(original, {
scale: 2,
useCORS: true,
onrendered: function(canvas) {
var imgData = canvas.toDataURL('image/jpeg');
var url = '/files/export.php';
$.ajax({
type: "POST",
url: url,
dataType: 'text',
data: {
base64data : imgData
}
});
}
}).then(canvas => {
canvasContainer.appendChild(canvas)
})
}
And here is my export.php
<?php
$data = $_REQUEST['base64data'];
//echo $data;
$image = explode('base64,',$data);
file_put_contents('here.png', base64_decode($image[1]));
?>
Any clues on what I’m missing here?