从MongoDB检索/发布图像（猫鼬）

Question

过去一段时间以来，我一直在尝试使用mongodb中的图像。 我一直看的每个地方都说使用GridFS，因为每个文档的大小限制为16mb。 但是，每个要存储的文件ID均小于16mb。 我目前这样存储

var testChamp = new Champion ({
    name: "Aatrox",
    img: fs.readFileSync("D:/CounterMe/Aatrox_0.jpg"),
    contentType: "jpg"
});
testChamp.save(function() {
    console.log("Saved");
}) 

在我的架构中：

name: String,
img: Buffer,
contentType: String `

在mongoshell中找到此信息会在cmd中带来大量的行，因此Im不确定im是否正确存储了它。 如果我是，我不知道如何将其插入到html中。 我知道如何检索名称，并将其作为对象传递：

app.get("/", function(req, response) {
    Champion.find(function(err, champs) {            
        response.render("index", {
        champ: champs[0]
        });            
    });
});

但是，一旦检索到champs [0] .img，我不确定该如何处理。 我应该如何将img传递到HTML中？ 任何帮助，我们将不胜感激。

Answer 1

您确实不应该尝试使用HTML呈现。 我已经看到了方法，并且它们通常都是不好的，并且有一个很好的理由。

浏览器实现了一个缓存，因此，它之前检索到的所有“图像”都将保留在该缓存中。 但是，如果您以某种方式尝试“嵌入”该图像数据（例如，通过Base64编码），则基本上是在放弃该缓存功能，并导致该数据随每个请求发送。

如果必须以这种方式将图像存储在MongoDB中，则您的API中应该有一个单独的终结点，该终结点将返回基本上只是一个图像的东西。 因此，使所有请求“看起来像”它们只是从Web服务器获取图像。

首先稍微改变一下数据以反映出“文件名”：

var testChamp = new Champion ({
    name: "aatrox.jpg",
    img: fs.readFileSync("D:/CounterMe/Aatrox_0.jpg"),
    contentType: "image/jpg"
});

然后，您将获得如下控制器代码：

app.get("/images/:image", function(req,res) {
    Champion.findOne({ "name": req.param.image },function(err,champ) {
       res.set("Content-Type", champ.contentType);
       res.send( champ.img );
    });
});

然后，您可以像通常那样在模板中引用图像的URL。 您可以添加它，甚至可以存储诸如内容长度之类的内容，并在响应标头中进行设置。 在存储它们之前，可以使用一些模块来检测通过其他API点上传的图像的mime类型和大小。 看看这些。

这是有道理的，并且比发送HTML中的所有图像数据要有效得多。

Answer 2

当我第一次进入Web开发时，我问了这个问题。 回到5年后，我的方法肯定是错误的。 我试图将自己的图像存储在mongodb中，当时我应该将它们存储在诸如S3的存储服务中，然后将指向这些图像的URL存储在mongodb中。 希望这对遇到这个问题的人有所帮助！