Node.js服务器无法获取Fetch POST请求的请求体问题求助

问题核心原因 #

浏览器端Fetch请求的配置项里，Headers拼写错误（应该是小写的headers），导致Content-Type: application/json请求头没有被正确发送。服务器的JSON解析中间件因为识别不到请求体的格式，所以不会解析，最终req.body返回空对象。

解决方案 #

1. 修正浏览器端Fetch代码

把配置中的大写Headers改成小写headers：

const checking = { name: "badmintion" }
function yo (){ 
     fetch("/user",{
         method : "POST",
         headers : { // 此处改为小写headers
             'Content-Type':'application/json'
         },
         body: JSON.stringify(checking)
     })
}

yo();

2. 简化服务器端代码（可选）

Express 4.16及以上版本已经内置了body-parser的功能，无需单独安装body-parser包，可简化代码：

const express = require('express');

const app = express();
// 使用Express内置的解析中间件
app.use(express.urlencoded({ extended: true}));
app.use(express.json());

app.get("/user",function(req,res){
    res.send("just Checking");
});

app.post("/user", (req, res) => {
    console.log(req.body); // 现在会正确输出 { name: 'badmintion' }
    res.send("got the data");
});

app.listen(3000,function(){
    console.log("server is working at localhost 3000");
});

原理说明 #

只有当请求头中正确携带Content-Type: application/json时，服务器的express.json()（或bodyParser.json()）中间件才会自动将JSON格式的请求体解析为JavaScript对象，挂载到req.body上。如果请求头缺失或拼写错误，中间件会跳过解析，导致req.body为空。

内容的提问来源于stack exchange，提问作者Mohd Adnan