Multer文件上传错误（nodejs和react）答案

【问题标题】：Multer file upload error (nodejs and react)Multer文件上传错误（nodejs和react）
【发布时间】：2021-08-16 20:02:20
【问题描述】：

我已从客户端发送此请求。

if(file){
      const data = new FormData()
      const fileName = Date.now() + file.name
      data.append('file', file) // file comes from state while submitting
      data.append('name', fileName)
      try {
        await axios.post('/upload_image', data)      
      } catch (error) {
        console.log(error.message);
      }
}

节点

const multer = require('multer')


// file upload
const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    console.log(req.body);
    cb(null, "./public/images/");
  },
  filename: (req, file, cb) => {
    cb(null, req.body.name)
  },
});
const upload = multer({ storage });
router.post("/upload_image", upload.single('file'), (req,res)=>{
  console.log(req.body);
    try {
        res.status(200).json("file uploaded successfully")
    } catch (error) {
        console.log(error.message);
    }
});

如果我打印 req.body in

router.post("/upload_image", upload.single('file'), (req,res)=>{
 console.log(req.body.name)
console.log(req.file)
......................
.......................
})

这里名称被打印出来，req.file 也被打印出来。但是，里面

const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    ...................
..............................
  },
  filename: (req, file, cb) => {
    console.log(req.body.name); //undefined  
    cb(null, req.body.name)
  },
});

name 变得未定义，应用程序崩溃。为什么 req 对象没有转到 diskStorage 函数。这里有什么问题？

【问题讨论】：

标签： javascript node.js reactjs file-upload multer

【解决方案1】：

来自multer documentation：

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

如果您在前端的文件之前附加名称，则该名称应在req.body.name 处可用。

// Append name first before we send the file
// so we can access it in the backend
data.append('name', fileName);
data.append('file', file);

或者，您可以将文件名作为第三个参数直接发送给 append 函数：

data.append('file', file, fileName);

然后您可以使用req.file.originalname 在后端访问文件名。每当您在 Node.js 中处理文件上传时，请参阅此免费 Request Parsing in Node.js Guide。

【讨论】：