Node.js displaying images from Mongo's GridFS

Question

I have a nodejs app that uses Mongo and GridFS to store images. I'm trying to display these images to the browser via Node.js (using express framework).

I'm currently using:

            res.writeHead(200, {'Content-Type': 'image/jpeg' });
            res.end(imageStore.currentChunk.data.buffer, 'binary');

imageStore is a the gridStore object after creating a new GridStore and calling gridStore.open(...)

       var gridStore = new GridStore(self.collection.db, doc._id, doc.filename, 'r', {
            chunk_size: doc.chunkSize
        });
        gridStore.open(callback);

I'm sure this isn't the right way, it displays a broken image. Any suggestions?

Thanks!

Edit:

After updating to mongodb native 1.0.2, I'm trying to stream the data by using:

res.contentType("image/jpeg");
var imageStream = imageStore.stream(true);
imageStream.pipe(res);

imageStore is the object after using gridStore.open(function(err, imageStore){ })

score 5 · Accepted Answer · answered May 15 '12 at 08:22

make sure you are on 1.0.1 of the driver and use the pipe of the http request to stream the data, the example below is doing it to a file. In 1.1 it will get even better as the gridstore object will be a read/write stream compatible object :)

/**
 * A simple example showing how to pipe a file stream through from gridfs to a file
 *
 * @_class gridstore
 * @_function stream
 * @ignore
 */
exports.shouldCorrectlyPipeAGridFsToAfile = function(test) {
  var db = new Db('integration_tests', new Server("127.0.0.1", 27017, 
   {auto_reconnect: false, poolSize: 1, ssl:useSSL}), {native_parser: native_parser});

  // Establish connection to db  
  db.open(function(err, db) {
    // Open a file for writing
    var gridStoreWrite = new GridStore(db, "test_gs_read_stream_pipe", "w", {chunkSize:1024});
    gridStoreWrite.writeFile("./test/gridstore/test_gs_weird_bug.png", function(err, result) {      
      // Open the gridStore for reading and pipe to a file
      var gridStore = new GridStore(db, "test_gs_read_stream_pipe", "r");
      gridStore.open(function(err, gridStore) {
        // Grab the read stream
        var stream = gridStore.stream(true);
        // When the stream is finished close the database
        stream.on("end", function(err) {          
          // Read the original content
          var originalData = fs.readFileSync("./test/gridstore/test_gs_weird_bug.png");
          // Ensure we are doing writing before attempting to open the file
          fs.readFile("./test_gs_weird_bug_streamed.tmp", function(err, streamedData) {
            // Compare the data
            test.deepEqual(originalData, streamedData);

            // Close the database
            db.close();
            test.done();          
          });
        })

        // Create a file write stream
        var fileStream = fs.createWriteStream("./test_gs_weird_bug_streamed.tmp");
        // Pipe out the data
        stream.pipe(fileStream);
      })
    })
  });
}

I've updated my version to 1.0.2. But I get a broken image, in PHP it works fine. I've updated my post above with the code, thank you! — dzm, May 18 '12 at 15:34
are you sure the php driver works correctly. The way to test your code is to use the binary mongofiles that comes with your monogo server and upload a test file and then stream it with your code. — christkv, May 24 '12 at 14:37

Roman Rhrn Nesterov · Answer 2 · 2013-04-10T06:37:22.273

0

env: express (3.0), mongodb-native-driver (1.2), mongodb (2.2)

gs - file info after GridStore.writeFile

res - express response object

monogodb.GridStore.read(db, gs["_id"], function(err, data) {

  res.setHeader('Content-Type', gs.contentType);
  res.setHeader('Content-Length', gs.length);
  res.setHeader('Content-Disposition', 'inline; filename="' + gs.filename + '"');

  res.end(data);

});

edited Apr 10 '13 at 06:37

answered Apr 09 '13 at 19:57

Roman Rhrn Nesterov

3,538
1
28
16

Node.js displaying images from Mongo's GridFS

2 Answers2

Linked