如何使用车把在 html 中显示图像来自 MYSQL 作为 blob

Question

我想在 HTML 中使用手柄条

将商店图像显示为 blob

这是我在app.js

中查询图片的方式

 app.get('/',(request,response)=>{
 db.query('select Image from pictures LIMIT 3', function(err, result) {
    
    let base64String = result.toString("base64");
    //var image = '<img src="'+base64String+'" class="denr-logo">';
   response.render('NPPNP',{images:base64String});
    //response.send(base64String);
    });

他们将几个网站转换为 base64 字符串并将其与标签和 'data:image;base64,xxx=='

组合

实际上我研究了几种方法和例子，但我无法理解它们是如何做到的。

当我 console.log base64String 时，它显示 [object Object] 并且当我将它传递给 HTML 没什么...

使用把手

  {{#each images}}
       {{this.Image}}
  {{/each}}

这是转换为base64.

之前的结果

 [{"Image":{"type":"Buffer","data":[137,80,78,71,13,10,26,10,0,0,0,13............

Answer 1

首先，您需要使用“result[0].Image”获取二进制值，正如我们在您的结果中看到的那样

第二次将二进制文件转换为 base64 这会给你这样的结果 iVBORw0KGgoAAAANSUhEU==

    var base = Buffer.from(result[0].Image);
    var conversion = base.toString('base64');
    var send = '<img src="data:image/png;base64,'+conversion+'" alt="something familiar"/>';
    response.send(send);

它可能会解决你的问题，我自己做了并且成功了

如何使用车把在 html 中显示图像来自 MYSQL 作为 blob

How to show image in html using handlebars comes from MYSQL as blob

mysql

blob

node.js

handlebars.js