Иногда пользователь не сможет выбрать файл и прикрепить его к входному файлу, или вы реализуете функцию с javascript, которая генерирует изображение base64 (например, чтобы сделать снимок у пользователя и сохранить его на сервере). И «это плохая идея» (в вопросе производительности) сохранить строку base64 в вашей базе данных, чтобы легко обрабатывать изображения, чтобы иметь файлы.
Возможно, вы уже знаете, как отправить образ base64 на сервер, однако некоторая дополнительная информация никому не повредит:
Как отправить base64 на сервер
Как правило, вы можете использовать простую форму и текстовое поле (поскольку изображение base64 может быть слишком длинным), а затем использовать javascript для сохранения сгенерированного base64 в texarea и последующего извлечения его на сервере.
Send image
// on the submit event, generate a image from the canvas and save the data in the textarea
document.getElementById('form').addEventListener("submit",function(){
var canvas = document.getElementById("myCanvasImage");
var image = canvas.toDataURL(); // data:image/png....
document.getElementById('base64').value = image;
},false);
Или, если вы не хотите использовать форму, просто используйте ajax:
var image = "data:image/png;base64,BBBFBfj42Pj4"; // to create a image read the previous example
$.ajax({
url:"service/url/process.php",
// send the base64 post parameter
data:{
base64: image
},
// important POST method !
type:"post",
complete:function(){
console.log("Ready");
}
});Сохранить строку base64 как изображение с PHP
Бэкэнд-часть действительно проста в обращении, единственная часть, которую вам нужно выяснить, это как извлечь строку из запроса ($ _POST или как вы извлекаете информацию о посте с вашей любимой платформой).
// baseFromJavascript will be the javascript base64 string retrieved of some way (async or post submited)
$baseFromJavascript = "data:image/png;base64,BBBFBfj42Pj4"; // $_POST['base64']; //your data in base64 'data:image/png....';
// We need to remove the "data:image/png;base64,"
$base_to_php = explode(',', $baseFromJavascript);
// the 2nd item in the base_to_php array contains the content of the image
$data = base64_decode($base_to_php[1]);
// here you can detect if type is png or jpg if you want
$filepath = "/path/to/my-files/image.png"; // or image.jpg
// Save the image in a defined path
file_put_contents($filepath,$data);Примечание. Вы можете упростить предыдущий код с помощью регулярного выражения:
$baseFromJavascript = "data:image/png;base64,BBBFBfj42Pj4";
// remove the part that we don't need from the provided image and decode it
$data = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $baseFromJavascript));
$filepath = "/path/to/my-files/image.png"; // or image.jpg
// Save the image in a defined path
file_put_contents($filepath,$data);
