Некоторое время я искал в Интернете и не могу найти ничего, что подсказывает мне, как я $('#image-cropper').cropit('export') результат из $('#image-cropper').cropit('export') в изображение, которое PHP может загрузить на сервер , Я использую плагин Cropit, и все, что мне нужно, – это изображение, которое я могу передать в сценарий загрузки php. Мой код выглядит следующим образом:
HTML:
<div id="image-cropper"> <input type="file" class="cropit-image-input" /> <div class="cropit-image-preview"></div> <input type="range" class="cropit-image-zoom-input" /> <button class="export">Export</button> </div>
JQuery:
var username = "<?php echo $userData['username']; ?>"; $('#image-cropper').cropit({ imageState:{ src:'users/'+username+'/profile_picture.jpg' }, }); $('#image-cropper').cropit('previewSize', {width:500, height:500}); $('.export').click(function() { var imageData = $('#image-cropper').cropit('export'); //$("#code").val(imageData); window.open(imageData); });
Код здесь работает правильно для плагина, но я не могу повернуть результат, который выглядит примерно как data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPoAAAD... в изображение, которое я могу использовать в php-скрипте. Любая помощь будет большой. Благодаря!
Способ, которым я работал, – это возиться с настройками качества Cropit и создать функцию PHP, которая читает строку base64 и преобразует ее в изображение.
Ниже приведен код для урожая. Я устанавливаю тайм-аут, потому что если вы этого не сделаете, он отправит форму в php, прежде чем cropit сможет создать base64. Строка base64 просто сохраняется в текстовом поле, которое php может связывать на основе $_POST
//Initiate Cropper $('.image-editor').cropit(); //Assign Export Function $('.export').click(function() { var imageData = $('.image-editor').cropit('export', { type: 'image/jpeg', quality: 0.33, originalSize: true, }); //Set value of hidden input to base64 $("#hidden_base64").val(imageData); //Pause form submission until input is populated window.setTimeout(function() { document.upload_form.submit(); alert(imageData); }, 1000); });
Код ниже для php. Он работает, расшифровывая base64 и перемещая его в указанный каталог.
function decode ($code, $username) { list($type, $code) = explode(';', $code); list(, $code) = explode(',', $code); $code = base64_decode($code); file_put_contents('directory/filename.jpg', $code); }