2012-03-23 11 views
8

Tengo un pequeño archivo .png almacenada en Mongo usando GridFS. Me gustaría mostrar la imagen en mi navegador web usando Node + Express + Jade. Puedo recuperar la imagen fina, por ejemplo:Render de imagen almacenados en Mongo (GridFS) con el Nodo + Jade + expreso

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

pero no sé cómo renderizarlo usando el motor de Jade View. No parece haber información en la documentación.

¿Alguien puede indicarme la dirección correcta?

Gracias!

Respuesta

16

Me di cuenta de esto (gracias Timoteo!). El problema era mi comprensión de todas estas tecnologías y cómo encajan unas con otras. Para cualquier otra persona que esté interesada en mostrar imágenes de MongoDB GridFS usando Node, Express y Jade ...

Mi documento en MongoDB tiene una referencia a la Imagen almacenada en GridFS que es un Id. De Objeto almacenado como una cadena. p.ej. MyEntity {ImageID: '4f6d39ab519b481eb4a5cf52'} < - NB: representación de cadena de OBJECTID. La razón por la que almacenan como una cadena se debía a que el almacenamiento de la OBJECTID me estaba dando un dolor en el enrutamiento, ya que rendía como binarios y no podía encontrar la manera de solucionar este problema. (Tal vez alguien puede ayudar aquí?). De todos modos, la solución que tengo es a continuación:

FileRepository - Recuperar la imagen de GridFS, paso en un ID de cadena, que luego convierto a un BSON OBJECTID (también se puede obtener el archivo de nombre de archivo) : Plantilla

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 - Render el Formato HTML:

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

app.js archivo - Routing (usando Express) I fijó el '/ data /: imgTag' ruta de imágenes dinámicas:

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); 
}); 

Y eso hicieron el trabajo. Para cualquier duda, hágamelo saber :)

8

Estoy un poco confundido acerca de lo que estamos tratando de hacer aquí, ya que Jade es un lenguaje de marcas para condesed salida de texto (como HTML), no contenido binario.

Dado que está utilizando Jade es probable que tenga algo como esto:

app.get/'images/:imgtag', function(req, res) { 
    res.render('image', {imgtag: req.params.imgtag); 
}); 

Así que trate esto:

app.get/'images/:imgtag', function(req, res) { 
    filerep.getFile(function(imgdata) { 
     res.header({'Content_type': 'image/jpeg'}) 
     res.end(imgdata); 
    }, req.params.imgtag); 
}); 

que enviará el archivo en bruto como una respuesta a la solicitud HTTP con el corregir el tipo de mimo. Si desea utilizar Jade para entregar una plantilla (como una ventana emergente de imagen), podría utilizar una ruta diferente para la ventana emergente o incluso usar una información: uri y codificar los datos de la imagen en la página.

+0

Fijar el tipo MIME o detectarlo de GridFS –

+0

Gracias Timoteo, que me señaló en la dirección correcta.Había otros problemas que necesitaba abordar, así que publiqué mi solución a continuación para ver si era completa. –

Cuestiones relacionadas