Возврат данных из Ajax в PHP

Question

Добрый день!

Я пытаюсь сохранить в базе данных имя моей картинки ... У меня есть следующий код Ajax ... Он отлично сохраняет картинку внутри папок, но я могу 't вернуть имя моего файла в переменную PHP из upload_foto_webcam.php ...

У меня есть 2 страницы ... Моя первая страница - это форма, и именно там я вызываю функцию Salvar_foto () ..После сохранения картинки я хочу вернуть на той же странице моей формы имя сохраненного изображения.

        function salvar_foto()
    {

        var file =  document.getElementById("base64image").src;
        var formdata = new FormData();
        formdata.append("base64image", file);
        var ajax = new XMLHttpRequest();
        ajax.addEventListener("load", function(event) { upload_completo(event);}, false);
        ajax.open("POST", "upload_foto_webcam.php");
        ajax.send(formdata);

        document.getElementById('take_pic').style.display = 'none';
        document.getElementById('take_pic_again').style.display = 'none';
        document.getElementById('save_pic').style.display = 'none';         
    }

Вот мой PHP-файл:

<?php
define('UPLOAD_DIR', 'uploads/');
$img = $_POST['base64image'];
$img = str_replace('data:image/jpeg;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR .date("d-m-Y")."_".uniqid(). '.jpg';
$success = file_put_contents($file, $data);

$cliente_foto_webcam = $file;

print $success ? $file : 'Não é possível salvar o arquivo.';
?>

Я хочуполучить обратно переменную $ cliente_foto_webcam ... Что мне делать?

Буду очень признателен, если вы мне поможете!

tks

Answer 1

Что вы хотите сделать с названием картинки?

Если для отображения имени сохраненного изображения пользователю, то вы можете использовать jQuery для получения имени файла из php-файла, в котором вы сохранили изображение.

Так что один из способов сделать этоэто напечатать / повторить имя файла внутри span или div или какого-либо объекта с тегом id, подобным этому:

$ajax_return = '<div class="hide_this">
                    <div id="ajax_response">'.$response.'</div>
                </div>';
echo $ajax_return;

Затем в файле, где вы сделали вызов ajax:

$.ajax({
    url: "upload_foto_webcam.php",
    method: 'POST',
    data: formdata,
    async: true,
    dataType: 'html',
    success: function(ajax_response) {
        // here you find the name of the saved image
        var saved_image_name = $(ajax_response).find("#ajax_response").text();
        // loading image name in container div/span
        $('#your_message_container').html(saved_image_name);
    }, // end success
    // handling error on ajax call
    error:  function(xhr, textStatus, errorThrown) {
        console.log(errorThrown ) ;
    } // end error handling
});

Вы можете отформатировать сообщение в php-файле, в котором вы сохранили изображение, и вернуть полное сообщение:

Изображение было сохранено как your_generated_image_name.jpg

и поместите это сообщение в контейнер div.

Answer 2

Я бы предложил JSON-ответ от вашего PHP-бэкэнда, что-то вроде:

{
    "filename": "my_image.jpg",
    "message": "Image uploaded!",
    "success": true
}

Что было бы примерно так:

<?php
define('UPLOAD_DIR', 'uploads/');
$img = $_POST['base64image'];
$img = str_replace('data:image/jpeg;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR .date("d-m-Y")."_".uniqid(). '.jpg';
$success = file_put_contents($file, $data);

$cliente_foto_webcam = $file;

if ($success) {
    echo json_encode([
        "filename" => $cliente_foto_webcam,
        "message" => "Image uploaded!",
        "success" => true
    ]);
} else {
    echo json_encode([
        "filename" => null,
        "message" => "Couldn't upload image",
        "success" => false
    ]);
}
?>