从MongoDB(猫鼬)检索/发布图像

Retrieving/Posting Images From MongoDB (mongoose)

本文关键字:布图像 图像 检索 MongoDB 猫鼬      更新时间:2023-09-26

我一直试图在mongodb的图像工作,而过去,现在。我一直在寻找的每个地方都说使用GridFS,因为每个文档的大小限制为16mb。但是,我想要存储的每个文档是16mb。我现在是这样存储的

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

In my schema:

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

在mongoshell中找到这个信息会在cmd中产生大量的行,所以我不确定我是否正确地存储它。如果我是,我不知道如何将它插入到我的html。我知道如何检索名称,将其作为对象传入:

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

然而,一旦我检索champs[0]。我,我不知道该怎么办。我应该如何将img传递到我的HTML中?如果有任何帮助,我将不胜感激,我现在非常困惑。

你真的不应该尝试用HTML来呈现。我看过一些方法,它们通常都很糟糕,而且有一个很好的理由。

浏览器实现了缓存,因此它之前检索到的任何"图像"都将保存在缓存中。但是,如果你以某种方式试图"嵌入"图像数据(例如通过Base64编码),你基本上是抛弃了缓存功能,并导致每个请求都发送该数据。

如果你必须以这种方式在MongoDB中存储图像,那么你应该在你的API中有一个单独的端点,它将返回基本上只是一个图像。所以让所有的请求"看起来像"他们只是从web服务器获取图像。

首先稍微改变一下你的数据,以反映什么是"filename":

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。你可以添加甚至可能存储内容长度之类的东西并在响应header中设置。您可以使用一些模块来检测通过另一个API点上传的图像的mime类型和大小,然后再存储它们。看看这些

这是有意义的,并且比在HTML中发送所有图像数据要有效得多。

当我第一次进入web开发时,我问过这个问题。5年后再回过头来看,我的方法绝对是错误的。我试图将我的图像本身存储在mongodb中,当我应该将它们存储在像S3这样的存储服务中时,然后只是将url存储到mongodb中的图像。希望这对遇到这种情况的人有所帮助!