如何在nodejs中读取formdata

Question

我在前端使用 ionic angular，我试图发送一个包含一个文件和 2 个字符串的表单数据。 显然它被发送但是我不知道如何在服务器端读取该信息

前端

private fil3: File;
  changePicture(fileChangeEvent){//this functions is called by an input file
    this.fil3 = fileChangeEvent.target.files[0];
            
    let a1 = "a1"
    let a2 = "a2"

    let b1 = "b1"
    let b2 = "b2"

    let formData = new FormData();    

    formData.append('photo', this.fil3, this.fil3.name);
    formData.append(a1, a2);
    formData.append(b1, b2);
    
    fetch('http://localhost:3000/up', {
    method: 'POST', 
    body: formData, 
    headers:{
        /* 'Content-Type': 'application/json' */
        'Content-Type': "multipart/form-data"
    },
    mode: "cors",
  }).then(res =>{ res.json().then((data)=>{   

    console.log("filename: "+data.filename); 
    console.log("originalname: "+data.originalname); 
    console.log("message: "+data.message); 
    this.avatar="../../assets/uploads/"+data.filename
            
    })    
  }) 
  .catch(error => {console.error('Error:', error)})
  .then(response => {console.log(response)});
  }//changePicture

服务器

 function updatePicture (req, res) {

   console.log("req.body: "+req.body)    

} 

在服务器端，我只是尝试单独读取 formdata 的每个元素，以便我可以使用它们。 这些元素是文件和另外两个字符串 (a1,a2,b1,b2)。 服务器上的这个 console.log 打印这个req.body: [object Object]

我试过这样的事情

console.log("req.body: "+req.body.a1) 
console.log("req.body: "+req.body.[1])

但肯定不起作用，我得到了undefined ，我不知道如何处理这个，有什么建议吗？

后端的最小可复制代码

const express = require ('express')
const bodyParser = require ('body-parser')
const app = express()
const api = express.Router()
const cors = require('cors')


app.use(bodyParser.urlencoded({ extended:false}))
app.use(bodyParser.json())



app.use(cors({
    origin: true
}));


const PORT = 3000;
app.listen(config.port, ()=>{
    console.log(`Server running on port: ${PORT}`)
})


api.post('/up', (req, res) =>{
    console.log(req.body) 
})

Answer 1

首先，删除这部分：

headers:{
    /* 'Content-Type': 'application/json' */
    'Content-Type': "multipart/form-data"
}

因为如果手动定义Content-Type ，则无法通知boundary信息。 它需要由浏览器自动管理，因为您也发送文件。

其次，您需要一个库来解析您的多部分数据。 您可以使用formidable ：

const formidable = require('formidable');

//You're other codes

app.post('/up', (req, res) => {
    const form = formidable({ multiples: true });
    form.parse(req, (err, fields, files) => {
        console.log('fields: ', fields);
        console.log('files: ', files);
        res.send({ success: true });
    });
});

对我来说，这个日志类似于：

fields:  { a1: 'a2', b1: 'b2' }
files:  {
file: PersistentFile {
    ...