尝试从 MongoDB 读取图像缓冲区并弹出到 EJS。如何将其转换回图像？答案

【问题标题】：Trying to read image buffer from MongoDB and eject into EJS. How do I transform it back into an image?尝试从 MongoDB 读取图像缓冲区并弹出到 EJS。如何将其转换回图像？
【发布时间】：2018-01-01 14:16:08
【问题描述】：

我正在使用 EJS 引擎和 NodeJS，并且我有一个通过 fs.readFile 上传到数据库的图像。使用 Mongo 中的图像对象，我还有一个 type 属性，表示类似“image/png”，还有一个 buffer 属性表示类似“

目前，我在 Heroku 上使用 Node.js 和 EJS 引擎。我可以通过以下代码成功地将 MongoDB 对象中的照片发送到网页：

res.contentType(contentType);
res.send(data);

但是，此页面会重定向到我要发送到的网址。我想检索图像并将其加载到图像标签 src 中，但我不知道如何处理此自动重定向。

如何正确检索图像以便在 EJS 中使用它？

附：我不知道这是否重要，但我将在 Heroku 上进行部署。

【问题讨论】：

另一个人做错了。不要尝试在模板中渲染图像。相反，为您的浏览器客户端提供一个“端点”来检索图像数据，就像它是一个常规文件一样。浏览器已经内置了“缓存”机制（其中标头受到尊重），当它们已经有一个有效的副本时，它们不会费心去拉入内容。因此，如果您使用解析到您的端点的标准 <img src="something"> 标记，那么服务器可以解决它。将 base64 编码的图像填充到模板中是一种非常糟糕的设计模式。使用浏览器性能优化。
谢谢你，布雷克斯，你的评论。我想知道你能否给我一些关于如何从 NodeJS 获取到我的浏览器本地缓存的实现细节？

标签： node.js image mongodb heroku ejs

【解决方案1】：

router.get('/image/:id',(req,res)=>{
        image.findById(req.params.id,(err,data)=>{
            if(!err){
                res.contentType(data.img.contentType);
                res.send(data.img.data);
            }
        });

    });

首先编写此代码以加载图像，然后使用图像的 id 从页面发出请求。

<img src="/image/<%= id %>">

【讨论】：