如何在 jquerymobile 模板上显示存储在 MySql 数据库中的 blob 类型图像

Question

我有一个场景应该在我的 Jquerymobile 模板中显示图像。这些图像来自 MySQL 数据库。图片类型是blob类型，我是用PHP来检索我的数据的——如下

    <?php
include 'configure.php';
$qr = "SELECT * FROM food_beverage";
$res= mysql_query($qr);
$i=0;
while($row = mysql_fetch_array($res))
{
$restau_arr[$i]["fb_sno"] = $row["fb_sno"];
$restau_arr[$i]["fb_name"] = $row["fb_name"];
$restau_arr[$i]["fb_type"] = $row["fb_type"];
$restau_arr[$i]["fb_location"] = $row["fb_location"];
$restau_arr[$i]["fb_img"]= $row["fb_img"];
$restau_arr[$i]["fb_phno"]= $row["fb_phno"];
$restau_arr[$i]["fb_email"]= $row["fb_email"];
$i++;
}
 header('Content-type: application/json'); 
  echo json_encode($restau_arr);
?>

数据库中的值存储在一个数组中，并被转换为 JSON 格式，以便我可以使用以下 jquery 行调用它们 -

var url = "retrieve_all.php";   
     $.getJSON(url, function(json) {
                 .......
                  .......
                   ....... }

一旦在此函数中接收到值，我将使用 - 将它们附加到相应的 HTML 字段中 -

 $.each(json, function(i,v) {                                     
                    var restauName = v.fb_name;
                    var restauLoc = v.fb_location;
                    var restauNum = v.fb_phno;
                                    var restauImg = v.fb_img;
                    $("#restauName").html(restauName);
                    $("#restauLoc").html(restauLoc);
                    $("#restauNum").html(restauNum);
                    $("#restauImg").html(restauImg);
                    });

我能够理解图像不应被视为 JSON 格式。但如何处理呢？ 我应该在 PHP 中做什么才能让我的 blob 图像显示在我的页面/屏幕上？

方法正确吗？

为此，一开始我checked here寻求帮助，但我的情况似乎有所不同。

Answer 1

这比“单击此处查看结果”更多的是可以为您提供解决方案的注释；但试试这个：

• 除了图像之外，您还有一个有效的解决方案吗？
• 图像大吗？
  • 如果它们是图标，我会将图像数据嵌入到相同的 JSON 响应中（见末尾）
  • 如果它们是照片，我会返回一个 URL，并有第二个 HTTP 请求来下载它们。您可以通过 AJAX 响应处理程序将 元素附加到文档。
  • 图像服务脚本将获取 ID，对其进行验证，然后返回 DB 字段值。
  • 您需要确保您的二进制数据没有进行字符集转换，否则图像将被损坏。

将所有内容嵌入到单个响应中

• rfc2397
• 使图像 JSON 项看起来像：
  • data:image/jpeg;base64,base_64_encoded_jpeg_goes_here
  • 显然，您可以更改 mime 编码以满足您的需要。
• 添加一些 JS 来获取这个字符串，附加一个 元素，将该数据作为 src 属性。

我有一个JSON to img elements 的粗略演示（带有外部文件）。