Node.js POST接口req.body为undefined问题：如何获取fetch传递的值？

你的问题主要出在后端没配置请求体解析中间件，加上前端fetch请求的几个配置错误，导致无法正确获取POST数据。下面一步步来修复：

第一步：修复Node.js后端代码 #

Express默认不会自动解析JSON格式的请求体，所以必须添加express.json()中间件来处理。修改后的代码如下：

const express=require('express');
const app=express()
const port=3000
const fs=require('fs');

// 关键：添加JSON请求体解析中间件
app.use(express.json());

app.get('/',(req,res)=>{
 res.send('hello world!');
});
app.get('/movies',(req,res)=>{
 fs.readFile(__dirname+'/movies.json','utf-8',(err,data)=>{
 res.send(data);
 });
});
app.post('/movies',(req,res)=>{
 console.log(req.body);
 // 记得给前端返回响应，避免请求挂起
 res.status(200).json({received: req.body});
});
app.listen(port,()=>{
 console.log(`app listening at http://localhost:${port}`)
});

如果之后需要处理表单x-www-form-urlencoded格式的数据，还可以追加一行：app.use(express.urlencoded({ extended: true }))，本次用JSON格式只需上面的配置。

第二步：修复前端HTML中的fetch请求 #

你的前端代码有三个明显问题，逐一修正：

1. 使用await但未给函数声明async，会触发语法错误
2. body直接传对象，fetch需要把对象转为JSON字符串才能被后端解析
3. mode: 'no-cors'会限制浏览器处理请求，且Access-Control-Allow-Origin是后端响应头，前端请求里加它无效

修改后的前端代码：

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title></title>
</head>
<body>
 <form onsubmit="submitted(event)">
 <input id="field" type="text" required="true">
 <button type="submit">save</button>
 </form>
</body>
<script>
// 给函数添加async关键字
async function submitted(e){
 e.preventDefault();
 const value=document.getElementById('field').value;
 try {
   const response = await fetch('http://localhost:3000/movies',{
     method:'POST',
     // 将对象转为JSON字符串
     body: JSON.stringify({value}),
     headers:{
       "Content-Type" : "application/json"
     }
   });
   const result = await response.json();
   console.log('服务器返回:', result);
 } catch (err) {
   console.error('请求出错:', err);
 }
}
</script>
</html>

第三步：处理跨域问题（可选但关键） #

如果你的前端页面是通过本地文件直接打开（file://协议），或者运行在其他端口的服务器上，会遇到跨域报错。这时候需要给Express后端配置CORS：

1. 先安装cors依赖：

npm install cors

2. 在后端代码中引入并使用：

const cors = require('cors');
// 允许所有来源的跨域请求
app.use(cors());

现在重启Node.js服务器，测试表单提交，就能在后端控制台看到req.body打印出你输入的内容了！

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