2016-01-20 118 views
1

我已經能夠成功地使用GridF將圖像上傳到mongoDB。 下面是從我的數據庫圖片:使用GridFs讀取和顯示來自mongoDB的圖像

MongoLab

fs.files:

enter image description here

fs.chunks:

enter image description here

下面是我用來上傳圖片的代碼:

var Grid = require('gridfs-stream'); 
var mongoose = require("mongoose"); 
Grid.mongo = mongoose.mongo; 
var gfs = new Grid(mongoose.connection.db); 

app.post('/picture', function(req, res) { 
var part = req.files.filefield; 

      var writeStream = gfs.createWriteStream({ 
       filename: part.name, 
       mode: 'w', 
       content_type:part.mimetype 
      }); 


      writeStream.on('close', function() { 
       return res.status(200).send({ 
        message: 'Success' 
       }); 
      }); 

      writeStream.write(part.name); 

      writeStream.end(); 
    }); 

的問題:

我似乎無法弄清楚如何從MongoDB中讀取此圖像,並在前端的顯示出來一個HTML <img>標記。

我已經試過這到目前爲止但只顯示文件名:

app.get('/picture', function(req, res) { 


gfs.files.find({ filename: 'trooper.jpeg' }).toArray(function (err, files) { 

    if(files.length===0){ 
     return res.status(400).send({ 
      message: 'File not found' 
     }); 
    } 

    res.writeHead(200, {'Content-Type': files[0].contentType}); 

    var readstream = gfs.createReadStream({ 
      filename: files[0].filename 
    }); 

    readstream.on('data', function(chunk) { 
     res.write(chunk); 
    }); 

    readstream.on('end', function() { 
     res.end();   
    }); 

    readstream.on('error', function (err) { 
     console.log('An error occurred!', err); 
     throw err; 
    }); 
    }); 
}); 

我已經採取了從here

上面的代碼中任何人都可以請幫助。我一直堅持這個天!

回答

2

它確實應該

writeStream.write(part.data); 

writeStream.write(part.name); 
+0

再次感謝大家的回答。如果我使用part.data,它會在運行時出現錯誤,表示無法讀取未定義的屬性「長度」。任何線索? – Skywalker

+0

你忘了添加'busboy-body-parser'中間件?它在你提到的教程中:https://www.codetutorial.io/file-upload-gridfs-mean-stack-meanjs/#crayon-56a0ddae56fde861598831 –

+0

你先生真棒。它終於工作。我拉着我的頭髮! – Skywalker