Question

我使用express js模板引擎在mongodb中存储了一个二进制图像。我的目标是一次显示mongodb中的所有现有图像。当我执行（/ picture）时，只显示一个图像。请帮我显示数据库中的所有图像。提前谢谢你：）

我已将图像存储到我的mongodb集合中，它看起来像这样：

我的路由器看起来像：

＆＃13;

express = require('express')
   , router = express.Router()
   , MongoClient = require('mongodb').MongoClient
   , ObjectId = require('mongodb').ObjectId
   , fs = require('fs-extra')
   // Your mongodb or mLabs connection string
   , url = 'mongodb://localhost:27017'
   , dbname= 'coffee_Image'
   , multer = require('multer')
   , util = require('util')
   , upload = multer({limits: {fileSize: 2000000 },dest:'/uploads/'}) 
// Default route http://localhost:3000/
router.get('/', function(req, res){ res.render('index'); });
// Form POST action handler
router.post('/uploadpicture', upload.single('picture'), function (req, res){ 
if (req.file == null) {
   // If Submit was accidentally clicked with no file selected...
  res.render('index', { title:'Please select a picture file to submit!'});
} else { 
MongoClient.connect(url, function(err, client){
   const db = client.db(dbname);
   // read the img file from tmp in-memory location
   var newImg = fs.readFileSync(req.file.path);
   // encode the file as a base64 string.
   var encImg = newImg.toString('base64');
   // define your new document
   var newItem = {
      description: req.body.description,
      contentType: req.file.mimetype,
      size: req.file.size,
      img: Buffer(encImg, 'base64')
   };
db.collection('CoffeeImg')
   .insert(newItem, function(err, result){
   if (err) { console.log(err); };
      var newoid = new ObjectId(result.ops[0]._id);
      fs.remove(req.file.path, function(err) {
         if (err) { console.log(err) };
         res.render('index', {title:'Thanks for the Picture!'});
         });
      });
   });
   };
});

router.get('/picture', function(req, res){
var filename = req.params.picture;
   MongoClient.connect(url, function(err, client){
   const db = client.db(dbname);
   db.collection('CoffeeImg').find({filename}).toArray(function(err, results){
	if(err) throw err;
	results.forEach(function(result) {
        res.end(result.img.buffer);
	});
      });
   });
});

router.get('/AllPicture', function(req, res){
var filename = req.params.picture;
   MongoClient.connect(url, function(err, client){
   const db = client.db(dbname);
   db.collection('CoffeeImg').find({filename}).toArray(function(err, results){
	if(err) throw err;
	res.json(results);
      });
   });
});

module.exports = router;

＆＃13;

html文件看起来像：

＆＃13;

<!DOCTYPE html>
<html>
  <head>
    <title>test</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
	<form action="/uploadpicture" method="POST" enctype="multipart/form-data">
	<input type="file" name="picture" accept="application/x-zip-compressed,image/*">
	<input class="form-control" type="text" name="description" placeholder="Description or Message">
	<input class="btn btn-primary" type="submit" value="submit">
	</form>
  </body>
</html>

＆＃13;

当我输入localhost：3000 / picture时，我只得到第一张图片：

从mongodb立即上传所有图片

0 个答案: