为什么我无法使用 multer 访问 req.body？

Question

我的应用程序（使用 vue）允许用户将包含一些数据信息的文件上传到我的节点后端。当用户提交表单时，这个函数被触发：

methods: {
      buttonOK () {
        const formData = new FormData()

        formData.append('name', this.detailFirm.name)
        formData.append('description', this.detailFirm.description)
        formData.append('version', this.detailFirm.version)
        formData.append('date', this.detailFirm.date)
        formData.append('file', this.file)

        for (var [key, value] of formData.entries()) {
          console.log(key, value)
        }

        let headers = {
          'Content-Type': 'multipart/form-data',
          'Accept': 'multipart/form-data'
        }

        this.$http.put('/firmware', formData, {headers: headers})
        this.visible = false
      }

日志语句显示了它应该显示的所有内容，当发出此请求时，chrome 开发工具中的网络选项卡显示了 post 正在处理的数据，并且它具有所有它应该的值：

name: test
description: test
version: 1
date: 0555-05-05
file: (binary)

我的 multer 中间件是这样的：

const multer = require('multer')
const mult = multer({
  dest: '/firmware'
})

module.exports = function (req, res, next) {
  /* --Convert multipart/form-data to useable format within express-- */
  if (req.path === '/firmware') {
    mult.single('file')
    console.log('MULTER MIDDLEWARE')
  }
  next()
}

那里的日志语句有效，让我相信 multer 正在工作。
我似乎无法在后端访问此信息。在这里，我尝试了 file 和 formData 作为 mult.single('').

中的文件名

这是我的控制器函数：

let firmware = {
    name: req.body.name,
    version: req.body.version,
    description: req.body.description,
    date: req.body.date,
    file: req.body.file
  }
  firmwareRepo.create(firmware, (err, create) => {
                   .............

我已经阅读了一些其他问题，并做了一些调整，但是当我在控制器中登录 req.body 时，我总是得到一个空对象。请指教

Answer 1

https://github.com/expressjs/multer#diskstorage

请注意，req.body 可能尚未完全填充。这取决于客户端向服务器传输字段和文件的顺序。

Answer 2

编辑：

首先，我记得我在前端 (React) 上遇到了一个问题，添加了不需要的 headers（不知何故添加了 formdata headers u **** up everything），这里是例子：

data append stuff goes here 

const data = new FormData()

data.append('id', values.id)

......

return async (dispatch) => {
                const respond = await fetch('/api/postdata', {
                method: 'post',
                headers: {
                   //SEE? THIS IS EMPTY
                },
                body: data
            })

            // send form to backend
            dispatch(dataSend())
        }
    }

第二个问题可能在后端。问题是，您不能简单地通过 req.body 访问文件信息。您需要通过 req.file

访问它

  .post('/api/post', (req, res, next)=> {
    const photo = {}
    const newData = {}

    uploadData(req, res, (err) => {
      if(err){
        console.log('error')
      }
      else {
        Object.assign(photo, {file: req.file})
        Object.assign(newData, {newData: req.body})

然后把照片传到你想用它做点什么的地方

    const addDataController = new AddDataController(req, res, next, newAdvertData, photo)
    addAdvertController.postAdvert()
  }
})

基本上我所做的是将常规数据与文件分开，并将它们进一步传递以组合和总结表格。抱歉，如果这没有帮助，无论如何你已经很接近了！

Answer 3

我不知道为什么会这样，但是当我停止使用 multer 作为导入的中间件时，一切都开始正常运行，如下所示：

module.exports = function (req, res, next) {
  /* --Convert multipart/form-data to useable format within express-- */
  if (req.path === '/firmware') {
    mult.single('formData')
    console.log('MULTER MIDDLEWARE')
  }
  next()
}

而是直接将其应用于路由函数，如下所示：

router.put('/firmware', upload.single('formData'), firmware.create) // doesn't work as standalone middleware

如果有人知道为什么会这样，请告诉我。

为什么我无法使用 multer 访问 req.body？

Why can't I access req.body with multer?

node.js

express

vue.js

multer