javascript - 如何使用ajax显示数据库中的图像

Question

我正在开发一个简单的移动应用程序，它使用数据库来存储包括图像在内的内容，我正在使用 ajax 来请求信息并在应用程序上显示该信息。我遇到的问题是图像没有出现，我不知道为什么

这是我用来存储信息的代码

$image = $_FILES['articleImg']['tmp_name'];
$date = date('l') .' '. date('d') . ', ' . date('Y');

$query = "INSERT INTO newsapp (title, company, category, details,
image, created) VALUES (:title, :company, :category, :details, :image, :created)";
$query_params = array(":title" => $_POST['title'],
   ":company" => $_POST['company'],
   ":category" => $_POST['category'],
   ":details" => $_POST['details'],
   ":image" => file_get_contents($image),
   ":created" => $date);

我有这个文件返回数据库中的值，包括图像:

$query = "SELECT id, title, company, category, details, image, created FROM newsapp";
try {
  $stmt = $db->prepare($query);
  $stmt->execute();
} catch (PDOException $ex) {
  die ('Failed to run query: ' . $ex->getMessage());
}
$row = $stmt->fetchAll();
echo json_encode($row);

Ajax函数；

var url = "getnews.php"; 
    $.ajax({
        type: "POST",
        url: url, 
        crossDomain: true,
        cache: false,
        success: function(data)
            $.each(JSON.parse(data), function(i, value)
            {
                console.log(value.title); // return value from database
                console.log(value.image); // Return null
});

我已经尝试通过这样做来显示图像，但是没有用；然后我在控制台上检查了图像的值，它说 null

如果尝试在 php 上直接显示图像，效果很好。

echo '<img alt="blog"  src="data:image/jpg;base64,'.base64_encode( $rows['image'] ).'"/>';

Answer 1

您可以在将图像存储到数据库之前使用 base64_encode() 方法，因为从 BLOB 字段中检索时可以使用 json_encode() 方法。 (正如 Lawrence 上面所说，json_encode 不处理二进制数据)

IE:改变插入数据

":image" => file_get_contents($image), 

到

":image" => base64_encode(file_get_contents($image)),