req.body在POST请求中返回空数组

Question

我真的很困惑。我已经这样做了好几天，但似乎找不到正在发生的事情。我正在使用 FormData 将数据上传到数据库，而当我console.log(req.body);时，它总是返回空数组。这是代码

这是前端（React应用）

import React from 'react';
import logo from './logo.svg';
import './App.css';

const App = () => {

  const submit = () => {
    const data = new FormData()
    data.append("theme", "This is the theme")
    fetch("/", {
      method: "post",
      headers: {
        "Content-Type": "multipart/form-data"
      },
      body: data
    }).then(res => res.json())
    .then(result => {
      console.log(result)
    })
    }

  return (
    <div>
      <button onClick={ () => submit() }>submit</button>
    </div>
  )
}

export default App;

这是后端

const express = require("express")
const bodyParser = require("body-parser")
const path = require('path')

const app = express()
app.use(bodyParser.urlencoded({ extended: true }))
app.use(bodyParser.json())
app.use(express.static('./public'));

app.post("/", (req, res) => {
    console.log(req.body)
})


app.listen(5000, () => {
    console.log("Port started on 5000")
})

Answer 1

如果您只想发送不带文件的数据，则以JSON而不是@Transactional void someFunction() { // Some logic jdbcTemplate.batchUpdate(...); }

的形式发送

如果您查看multipart/form-data文档，将会看到...

由于多部分实体的复杂性和 通常是大自然。对于多部分实体，您可能会感兴趣 以下模块：

busboy和connect-busboy，多方和connect-multiparty，强大， multer

您可以在bod-parser文档顶部的某处找到此注释。

如果您想发送body-parser，则说您要上传文件，然后使用Multer。

https://www.npmjs.com/package/multer

但是，您需要将标头重写为multipart/form-data并发送和加密对象

尝试一下：

application/json

Answer 2

如正文分析器文档中所述，正文分析器不处理多部分表单。 see docs here.

所以您必须左选择：以json格式发送表单数据（假设您未上传文件或其他内容..）

或使用您可以在我提供的链接上找到的任何推荐替代方法（据我所知，multer是最常用的替代方法）

Answer 3

要解析表单数据，您必须使用https://bugs.python.org/issue13703中间件。

在处理POST请求之前，将以下内容添加到您的代码中

BodyParser不再与Express捆绑在一起

var bodyParser = require("body-parser");
app.use(bodyParser.urlencoded({ extended: false }));

根据我的阅读记录，您还可以使用bodyParser.urlencoded

下面的示例代码对我有用。根据您的需要进行更新

var express = require('express');
var bodyParser = require('body-parser');
var multer = require('multer');
var upload = multer();
var app = express();

app.get('/', function(req, res){
   res.render('form');
});

app.set('view engine', 'pug');
app.set('views', './views');

// for parsing application/json
app.use(bodyParser.json()); 

// for parsing application/xwww-
app.use(bodyParser.urlencoded({ extended: true })); 
//form-urlencoded

// for parsing multipart/form-data
app.use(upload.array()); 
app.use(express.static('public'));

app.post('/', function(req, res){
   console.log(req.body);
   res.send("recieved your request!");
});
app.listen(3000);

还请注意：

在中间件之后，在请求对象上填充了一个包含解析数据的新主体对象（即req.body）。该对象将包含键值对，其中值可以是字符串或数组（当extended为false时）或任何类型（当extended为true时）。