Javascript 对于多个文件上载，req.file未定义

我已经通读了所有可能的答案，但我不确定问题是什么，因为它们都不起作用。我有一个表单可以上传一个图像，它可以按预期工作，但在另一个表单上，我尝试上传多个文件，并且有表单输入，req.file总是未定义，图像数据最终出现在req.body中。因此，我认为可能存在multer无法获取文件数据的问题

我在一些地方读到，body parser可能无法很好地使用multer，但不幸的是，我需要它们

路线

const destination = './public/uploads/posts';
const storage = multer.diskStorage({
  destination: destination,
  filename: (req, file, cb) => {
    cb(null, file.originalname);
  },
});
const upload = multer({storage}).array('images');

router.post('/posts', (req, res) => {

  upload(req, res, (err) => {
    if(err) {
      console.log('errors', err)
      res.json({success: false, error: err})
    } else {
      if(req.files === undefined) {
        console.log('error: Images returned undefined');
      } else {
        const { title, description, url, auth_name, auth_id } = req.body;

        if(!title || !description) {
          return res.json({
            success: false,
            error: 'All fields required',
            message: 'Title and description fields are required'
          });
        }

        // path we store in the db
        let imageLocation = [];
        const post = new Post();

        for (const file of req.files) {
          imageLocation.concat('/uploads/posts/' + file.filename)
        }

        post.title = title;
        post.description = description;
        post.url = url;
        post.author_name = auth_name;
        post.author = auth_id;
        post.images = imageLocation;
        post.save((err, post) => {
          if(err) {
            return res.json({ success: false, error: err, message: 'post failed' });
          } else {
            return res.json({ success: true, message: "added new post", post: post });
          }
        });
      }
    }
  });
});

在反应组件中发布

我的图像设置为我从DropZone软件包获得的状态（我在没有DropZone的情况下进行了测试，结果也是一样的。我确保输入名称为“images”

更新

在这方面的帮助下，我成功地使用我现有的路由和邮递员上传了图像。当我使用我的表单测试路由时，我仍然得到一个空的req.file，并且没有上传

我在我的设置中添加了express multipart file parser，我想正是它使我更接近于解决这个问题

服务器

这是我添加到server.js中的内容

 import { fileParser } from 'express-multipart-file-parser';
 app.use(fileParser({
  rawBodyOptions: {
      limit: '15mb',  //file size limit
  },
  busboyOptions: {
      limits: {
         fields: 20   //Number text fields allowed 
      }
  },
 }));

---

要正确填充

req.files

，您需要使用

formdata.append

如下：

images.forEach(image => {
  formdata.append('images', image);
})

---

要正确填充

req.files

，您需要使用

formdata.append

如下：

images.forEach(image => {
  formdata.append('images', image);
})

---

无法使用数组传递值

router.post('posts', upload.array('image', 10), function (req, res, next) {

})

---

无法使用数组传递值

router.post('posts', upload.array('image', 10), function (req, res, next) {

})

---

感谢所有的帮助。我成功地修复了它。原来我是在我的状态下将FileList对象连接到一个数组，所以结构完全错误，在服务器上失败了。我的图像现在可以完美地上传了

如果我发布了我的react组件的那部分，我相信你们中的任何人都会在一秒钟内注意到这一点，对不起。我没有想到这个问题是在我的组件中进一步出现的

问题

onFileLoad = (e) => {
  this.setState({
    images: this.state.images.concat(e.target.files)
  });
}

修复程序

onFileLoad = (e) => {
  this.setState({
   images: e.target.files
  });
}

submitMediaPOst = () => {
  const imageArr = Array.from(images);
  imageArr.forEach(image => {
    formdata.append('images', image);
  });
...

---

感谢所有的帮助。我成功地修复了它。原来我是在我的状态下将FileList对象连接到一个数组，所以结构完全错误，在服务器上失败了。我的图像现在可以完美地上传了

如果我发布了我的react组件的那部分，我相信你们中的任何人都会在一秒钟内注意到这一点，对不起。我没有想到这个问题是在我的组件中进一步出现的

问题

onFileLoad = (e) => {
  this.setState({
    images: this.state.images.concat(e.target.files)
  });
}

修复程序

onFileLoad = (e) => {
  this.setState({
   images: e.target.files
  });
}

submitMediaPOst = () => {
  const imageArr = Array.from(images);
  imageArr.forEach(image => {
    formdata.append('images', image);
  });
...

---

我用你的建议更新了我的代码，但我的req.file仍然没有返回任何内容。我用你的建议更新了我的代码，但我的req.file仍然没有返回任何内容。@kushboo-我这样使用它

const upload=multer（{storage:storage}）.array（'images'）；

我后来将它改为

const upload=multer（{storage:storage}）.array（'images'，10）；

但同样的问题。这种方法适用于我的单个文件上载。@kushboo-我是这样使用的

const upload=multer（{storage}）.array（'images'）；

我后来将它改为

const upload=multer（{storage:storage}）.array（'images'，10）

但同样的问题。这种方法适用于我的单个文件上载。所以你最终使用了我的建议。很高兴它有用。所以你最终使用了我的建议。很高兴它有用