如何在浏览器中渲染二进制图像？

Question

终端输出

我正在尝试获取存储在mongodb数据库中的图像，以便检索并渲染到浏览器。我已经尝试过一些以前的解决方案，如btoa、Windows。btoa，但它说两者都没有定义。(https://stackoverflow.com/questions/6182315/how-to-do-base64-encoding-in-node-js)(https://stackoverflow.com/questions/23097928/node-js-throws-btoa-is-not-defined-error)

我当前的代码如下所示：

<img src= <%= `data:${event.eventImage.mimetype};base64,` + Buffer.from(`${event.eventImage.file}`, 'binary').toString('base64') %> >

其导致在上面的链接中的输出。二进制中有很多“/”，我认为不应该在那里。我如何正确地转换二进制，使我的图像将呈现？

JSFIDLE

Answer 1

我最终按照布拉德的建议去做了。在我看来，我写道：

<img src='http://localhost:3000/public/images/<%=event._id %>' >

然后我在Nodejs中创建了一个路由来处理/images/：id。

router.get('/images/:id', function(req,res){
LCEvent.findById(req.params.id)
    .exec()
    .then(doc =>{
        res.send(doc.eventImage.file);
    })
    .catch(err => console.log(err));
})

在我的例子中，我的文档的结构是

{
     eventImage: { 
        file: Binary {...}, 
        filename: 'dreamlifestyle.jpg', 
        mimetype: 'image/jpeg'
    }
}