Question

我有一个像应用程序的pinterest。图像和其他相关信息存储在MongoDb中。通常图像的大小约为1mb。图像显示无限滚动。当加载带有base64字符串的长脚本时，浏览器崩溃或响应时间非常高（特别是对于Internet Explorer）显示存储在MongoDb中的图像的最佳方法是什么？

Answer 1

我认为实现这一目标的最佳方法是让您在服务器上的某个公共文件夹中进行物理存档。这应该是只需要使用

之类的方式访问的

http://www.myhost.com/images/my/path/to/image.jpg

您仍然可以将mongodb中的Base64映像维护为备份，但是，由于性能问题，这不是检索映像的最佳方法（如您所见）。我建议你做以下事情：

每次将图像存储在mongo上时，请务必同时存储＆＃34;图像文件＆＃34;在您的服务器上的某个公共场所本身。请记住，您应该在正在使用的mongo模型上保留该文件的路径。因此，下次调用对象时，您应该只获取图像的路径，而不是获取基本64图像。

让我们说，你有这个模型

myModel = {
    name: "some name",
    image64: "someextralongstringveryveryveryweird......",
    imageUrl: "/images/my/path/to/image/imagename-id.jpg"
}

下次查询时，您可以使用mongo投影忽略image64，在客户端，您只需使用一些使用该URL的html标记。

<img src="/images/my/path/to/image/imagename-id.jpg">

这将有助于您提高表现。

有些库可以帮助您管理图像文件的创建。 ImageMagick是我使用过的，而且用途广泛。

Answer 2

我猜你有这个应用程序的服务器端部分？为什么不创建一个小API来检索图像呢？

因此，您的浏览器会显示有关图片的信息，并可以向您的服务器询问，http://your_server/api/image/imageID或http://your_server/images/imagename，然后您的服务器只会传输此图片，您不会需要将其存储在文件系统中。

在客户端（浏览器），您只需要实现延迟加载＆＃39;。

Answer 3

如果您正在使用MongoDB，则应使用GridFS（http://excellencenodejsblog.com/gridfs-using-mongoose-nodejs/）将图像存储在数据库中，这一功能可为您的应用程序提供类似虚拟文件系统的功能。

使用GridFS，您可以编写一个控制器方法，从MongoDB实例流式传输所请求的文件，并将文件内容传递给响应。

Answer 4

我建议将图像存储在文件系统上，并使用您的Web服务器来处理为客户端提供的图像。为了提高性能，我会将它们放在 CDN 上 - 这将能够处理流量。

在您的应用程序存储（mongo）中，您可以将URL /位置存储到图像中，然后在您的javascript代码中检索图像时使用它。

此外，在您的代码中，我建议通过javascript预加载图像，在用户滚动查看图像之前预先加载图像。有一些很棒的工具可供您利用。

如果您无法更改存储空间，并且必须按原样使用mongo，我会查看使用javascript预加载图片。

Answer 5

我遇到了同样的问题。所以我用mongodb来存储我的图像。

这是我的工作方式：

定义徽标架构：

var logoSchema = new mongoose.Schema({
    name: String,
    url: String
});

将徽标架构编译为模型：

var Logo = mongoose.model("Logo", logoSchema)

创建新徽标：

var rectblack = new Logo({
    name:"rect&black",
    url:"public/image.jpg"
});

保存：

rectblack.save(function(err, logo){
    if(err){
        console.log("some went wrong")
    } else {
        console.log("logo saved")
        console.log("logo")
    }
});

现在要使用此徽标或图像，我刚刚使用图像标签（只是文件名！！）来称呼它：

<img src="/image.jpg">.

显示存储在MongoDb中的图像

5 个答案: