將數據從Ajax返回到PHP

Question

下午好！

我正在嘗試將圖片的名稱保存在數據庫中...我具有以下Ajax代碼。.它將圖片完美地保存在折疊中，但是我無法將文件名從中返回到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變量...該怎么辦？

如果您能幫助我，我將不勝感激！

ks

Answer 1

我建議您從PHP后端提供JSON答案，例如：

{
    "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
    ]);
}
?>

Answer 2

您要如何處理圖片名稱？

如果要向用戶顯示已保存圖像的名稱，則可以使用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_generation_image_name.jpg

並將此消息放入容器div中。