javascript - Base64 图像未在 html 中显示

Question

我正在尝试显示我在 php 文件中转换的 base64 图像。但是，当图像不可用或不存在时，我的 html 中的图像将显示为通用图像占位符。如果有人想知道我正在尝试显示属于特定网页表单的图像。但是，我有很多表单，当我单击其中一个表单时，我希望能够看到关联的图像。

我已经走到这一步了:我的 PHP 文件如下所示:

$imageDate = date_format($currentdate, 'YmdHis');
$path = 'C:/Temp/MgrReportUploads';
$type = pathinfo($path, PATHINFO_EXTENSION);

$files = glob($path.
    '/'.$imageDate.
    '_*');

if (!empty($files)) {
    foreach($files as $image) {

        $vals['encodedImages'] = 'data:image/'.$type.
        ';base64,'.base64_encode($image);

    }
}

echo json_encode ($vals);响应在网络选项卡上看起来像这样返回图像:{，…}

images: "data:image/jpg;base64,QzovVGVtcC9NZ3JSZXBvcnRVcGxvYWRzLzIwMTkxMTA4MTM0MzM5X2plZGkxLmpwZw=="

js文件//表单和图像上的回调变量

onSuccess: function(data) {

    var imgList = document.querySelector('#imageLst'); //div
    var img = document.createElement("img");
    img.setAttribute("src", data.encodedImages);
    imgList.append(img);
}

Answer 1

将 base64_encode($image) 更改为 base64_encode(file_get_contents($image))

glob 返回一个包含匹配文件/目录的数组，如果没有文件匹配则返回空数组，如果出错则返回 FALSE。

您必须将文件内容而不是文件路径传递给base64_encode