Я пытаюсь сохранить изображение холста на сервере. Я могу сохранить файл, но он всегда 0 байтов. Что случилось с моим кодом?
<script> function test(){ var canvas = document.getElementById("cvs"); var dataURL = canvas.toDataURL(); $.ajax({ type: "POST", url: "upload.php", data: { imgBase64: dataURL } }).done(function(o) { console.log('saved'); }); } </script>
PHP:
<?php define('UPLOAD_DIR', 'uploads/'); $img = $_POST['img']; $img = str_replace('data:image/png;base64,', '', $img); $img = str_replace(' ', '+', $img); $data = base64_decode($img); $file = UPLOAD_DIR . uniqid() . '.png'; $success = file_put_contents($file, $data); print $success ? $file : 'Unable to save the file.'; ?>
Сначала вы должны быть уверены, что вы нарисовали на холсте после того, как вы определили переменную canvas
и перед созданием dataURL
Во-вторых, кажется, что вы ищете img
в этой строке php:
$img = $_POST['img'];
но в вашем javascript вы определяете его как imgBase64
в:
data: { imgBase64: dataURL }
наконец, вы должны добавить console.log(dataURL)
после создания dataURL
, чтобы быть уверенным, что в нем что-то есть.