Я создаю холст и передаю его php так:
$('body').on('click','#save_image',function(){ html2canvas($('.myImage'), { onrendered: function(canvas) { //$('.imageHolder').html(canvas); var dataURL = canvas.toDataURL("image/png"); // $('.imageHolder').append('<img src="'+dataURL+'" />'); $('.imageHolder').html('Generating..'); $.post('image.php',{image: dataURL},function(data){ $('.imageHolder').html(data); }); } }); });
image.php:
<? $image = $_POST['image']; echo "<img src='$image' alt='image' />"; $decoded = str_replace('data:image/png;base64,','',$image); $name = time(); file_put_contents("/home/toni005/public_html/toniweb.us/div2img/" . $name . ".png", $decoded); echo '<p><a href="download.php?img='.$name.'.png">Download</a></p>'; ?>
download.php:
<? $file = $_GET['img']; header('Content-Description: File Transfer'); header("Content-type: image/jpg"); header("Content-disposition: attachment; filename= ".$file.""); readfile($file); ?>
Дело в том, что изображение сгенерировано, когда я нажимаю ссылку для загрузки, загрузка застывает, но изображение невозможно открыть (похоже, оно повреждено)
Что мне не хватает?
Его можно протестировать здесь: http://toniweb.us/div2img/
Вероятно, вы должны base64_decode()
URL-адрес данных. Он даже говорит об этом в самом URL-адресе: data:image/png;base64,...
$decoded = base64_decode(str_replace('data:image/png;base64,', '', $image));