使用Node + Jade + Express存储在Mongo（GridFS）中的渲染图像 [英] Render Image Stored in Mongo (GridFS) with Node + Jade + Express

问题描述

我有一个小的.png文件存储在Mongo使用GridFS。我想使用Node + Express + Jade在我的网络浏览器中显示图像。我可以检索图像，例如：

  FileRepository.prototype.getFile = function（callback，id）{
 this .gs = new GridStore（this.db，id，'r'）; 
 this.gs.open（回调）; 
}; 
  

但我不知道如何使用Jade View Engine进行渲染。文件中似乎没有任何
信息。

任何人都可以指向正确的方向？

谢谢！

解决方案

我想到了（谢谢蒂莫西！）问题是我对所有这些技术的了解以及它们如何组合在一起。对于任何有兴趣从MongoDB GridFS使用Node，Express和Jade ...显示图像的人，我们在MongoDB中的文档引用了存储在GridFS中的图像，一个ObjectId存储为
a字符串。例如MyEntity {ImageId：'4f6d39ab519b481eb4a5cf52'}< - NB：ObjectId的字符串表示形式。我把它存储为一个字符串的原因是因为存储ObjectId在路由中给我一个痛苦的
，因为它渲染为二进制，我无法弄清楚如何解决这个问题。 （也许有人可以帮忙吗？）无论如何，我的解决方案如下：

FileRepository - 从GridFS中检索图像，我传入一个String Id，然后我转换到
a BSON ObjectId（您也可以通过文件名获取文件）：

  FileRepository.prototype.getFile = function （callback，id）{
 var gs = new GridStore（this.db，new ObjectID（id），'r'）; 
 gs.open（function（err，gs）{
 gs.read（callback）; 
}）; 
}; 
  

---

玉模板渲染HTML标记：

  img（src ='/ data /＃{myentity.ImageId}'）
  

---

App.JS文件 - 路由（使用Express）我为动态图像设置'/ data /：imgtag'路由：

  app.get（'/ data / imgtag'，function（req，res）{
 fileRepository.getFile（function（error，data）{
 res.writeHead（'200'，{'Content-Type'：'image / png'} ）; 
 res.end（data，'binary'）; 
}，req.params.imgtag）; 
}）; 
  

---

这样做了。任何问题让我知道：）

I have a small .png file stored in Mongo using GridFS. I would like to display the image in my web browser using Node + Express + Jade. I can retrieve the image fine e.g.:

FileRepository.prototype.getFile = function(callback,id) {
this.gs = new GridStore(this.db,id, 'r');
this.gs.open(callback);
};

but I don't know how to render it using the Jade View Engine. There doesn't seem to be any information in the documentation.

Can anyone point me in the right direction?

Thanks!

解决方案

I figured this out (thanks Timothy!). The problem was my understanding of all these technologies and how they fit together. For anyone else who's interested in displaying images from MongoDB GridFS using Node, Express and Jade ...

My Document in MongoDB has a reference to the Image stored in GridFS which is an ObjectId stored as a string. e.g. MyEntity {ImageId:'4f6d39ab519b481eb4a5cf52'} <-- NB: String representation of ObjectId. The reason I stored it as a string was because storing the ObjectId was giving me a pain in the Routing as it was rendering as binary and I couldn't figure out how to fix this. (Maybe someone can help here?). Anyway, the solution I have is below:

FileRepository - Retrieve the image from GridFS, I pass in a String Id, which I then convert to a BSON ObjectId (you can also get the file by file name):

FileRepository.prototype.getFile = function(callback,id) {
   var gs = new GridStore(this.db,new ObjectID(id), 'r');
   gs.open(function(err,gs){
      gs.read(callback);
   });
 };

---

Jade Template - Render the HTML Markup:

img(src='/data/#{myentity.ImageId}')

---

App.JS file - Routing (using Express) I setup the '/data/:imgtag' route for dynamic images:

app.get('/data/:imgtag', function(req, res) {
  fileRepository.getFile( function(error,data) {
     res.writeHead('200', {'Content-Type': 'image/png'});
     res.end(data,'binary');
  }, req.params.imgtag );
});

---

And that did the job. Any questions let me know :)

这篇关于使用Node + Jade + Express存储在Mongo（GridFS）中的渲染图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！