将 Base64 代码保存到文件夹中会导致图像失败，并且无法使用 PHP 打开它

Question

我正在尝试将图像保存到我的项目的文件夹中，文件已保存但错误，导致无法查看或打开。

首先，我在选择图像后通过捕获base64图像代码的表单获取图像。然后，当我提交帖子时，我使用以下代码：

       var selectFotoAdjunta = document.getElementById("fotoAdjunta__url_val"); var selectedFotoAdjunta = selectFotoAdjunta.src; var selectedEncodedFotoAdjunta = encodeURIComponent(selectedFotoAdjunta);

然后，我通过帖子系统发送变量：

       var $form = $( this ), $submit = $form.find( 'button[type="submit"]' ), fotoadjunta_value = selectedEncodedFotoAdjunta, url = $form.attr('action');

    var posting = $.post( url, { 
        foto: fotoadjunta_value,
     });

然后我转到为表单选择的 PHP 代码，一开始就正确地到达了它。

变量base64代码看起来像这样：“data%3Aimage%2Fjpeg%3Bbase64%2CiVBORw0KGgoAAAANS...” 完整的base64编码图像在这里：https://justpaste.it/ft5rd

$extension = "jpeg";
if (!empty($foto)){
    $base64img = rawurldecode($foto);
    
    if (str_contains($base64img, 'data:image/jpeg')) { 
        $extension = "jpeg";
        $base64img = str_replace('data:image/jpeg;base64,', "", $base64img);
        
    } else if (str_contains($base64img, 'data:image/jpg')) {
        $extension = "jpg";
        $base64img = str_replace('data:image/jpg;base64,', "", $base64img);
        
    } else if (str_contains($base64img, 'data:image/png')) {
        $extension = "png";
        $base64img = str_replace('data:image/png;base64,', "", $base64img);
    } 
    
    $filename = '../Imagenes/temp_viajes.'.$extension;
    $fpc = file_put_contents($filename, $base64img);
        if ($fpc) { echo 'Image uploaded correctly'; }

}

但是当我转到包含图像的文件夹时，我得到了这个：

我也尝试过使用base64_decode函数而不是rawurldecode，但无论如何都是一样的。 你能帮我解决这个问题吗？我真的不知道发生了什么。

我尝试将图像下载到本地文件夹中，但无法正确执行。

Answer 1

您尝试存储的图像数据是 Base64 编码的。您正确地进行了 URL 解码并删除了

data

前缀，但错过了

base64_decode

部分。

尝试将倒数第二行更改为：

$fpc = file_put_contents($filename, base64_decode($base64img));

请注意，您应该对来自用户或表单的任何数据执行额外的验证，因为它很容易被利用。