使用 Multer 在 Nodejs 中上传多张图片

Question

我正在尝试使用 Multer 上传多张图片，但我一直收到错误 "TypeError: Cannot read property 'filename' of undefined"。我的代码适用于单个图像上传，但不适用于多个图像。我尝试了几次调试但无法找到问题所在。我想以以下格式将图像路径保存在数据库的一列中：image1，image2，image3 .....我是Multer的新手。我将不胜感激任何帮助。谢谢

JS代码

var multer = require('multer');

const storage = multer.diskStorage({
  destination: function(req, file, cb){
    cb(null,'./uploads/');
  },
  filename: function(req, file, cb){
    cb(null,file.fieldname + '-' + Date.now() + path.extname(file.originalname));
  }
});

// Init Upload
var upload = multer({
  storage: storage,
  limits:{fileSize: 1000000000},
  fileFilter: function(req, file, cb){
    checkFileType(file, cb);
  }
}).array('MyImage', 10);


router.post('/product', function (req, res, next) {
  upload(req, res, (err) => {
  const { prod, MyImage, description} = req.body;

   if(err){
    res.render('product', {
      msg: err
    });
  }
  else {
    db.query("insert into product(prod_name, picture, description) values ('" + prod + "', '" + req.file.filename + "', '" + description + "')", function (err, rs) {
      if (err) {
        console.log(err);
        req.flash('error', 'Error: Product not Inserted')
        res.redirect('/product');
      }
      else {
        req.flash('success_msg', 'Product Successfully Added')
        res.redirect('/product');
      }
    });
  }
  });
});

HTML代码（图片上传部分）

<form  action="/add_product" method="post" autocomplete="off"  enctype="multipart/form-data">
    <input type="file" id = "files" name = "MyImage" class="hidden" multiple/>
    <label for="files">Choose Image</label>
    <button type="submit" class="btn btn-primary btn-block">Submit</button>
</form>

Answer 1

单上传时必须使用：

req.file

但是当多个图片上传时你必须使用：

req.files

因为当你想上传多张照片时，你可以将它们作为数组访问。

意见和建议：

您可以使用以下包上传您的图片。除了上传之外，您还可以管理图像的存储和大小。

multer-sharp-resizer

编辑部分：（用于处理单张和多张图片示例）

const express = require("express");
const multer = require("multer");

const app = express();

const multerStorage = multer.memoryStorage();

// Filter files with multer
const multerFilter = (req, file, cb) => {
  if (file.mimetype.startsWith("image")) {
    cb(null, true);
  } else {
    cb("Not an image! Please upload only images.", false);
  }
};

const upload = multer({
  storage: multerStorage,
  fileFilter: multerFilter,
});

app.post('/profile', upload.single('avatar'), function (req, res, next) {
  // req.file is the `avatar` file
  // req.body will hold the text fields, if there were any
  console.log(req.file);
})

app.post('/photos/upload', upload.array('photos', 12), function (req, res, next) {
  // req.files is array of `photos` files
  // req.body will contain the text fields, if there were any
  console.log(req.files);
})

使用 Multer 在 Nodejs 中上传多张图片

Upload multiple image in Nodejs useing Multer

html

node.js

multer