JS表单开发中req.body返回异常格式无法访问数据的解决方案

问题场景 #

后端用Express接收POST请求时，req.body返回异常格式：

{ 'object Object': '' }

对其执行JSON.stringify()后显示为：

{ '{"A":"a","B":"b","C":"c"}': '' }

无法正常访问其中的A、B、C字段。

客户端处理逻辑：将JSON字符串解析后再转为字符串作为请求体，请求头设置为application/x-www-form-urlencoded；目标是让服务端能直接拿到格式为{ A: "a", B:"b", C: "c"}的请求体数据。

问题原因 #

application/x-www-form-urlencoded是表单键值对格式，Express默认的express.urlencoded()中间件会按键值对解析请求体。但客户端实际发送的是完整的JSON字符串，中间件会把整个JSON字符串当成一个键名，对应值为空，因此出现了异常的req.body格式。

解决方案 #

1. 客户端修改请求头与请求体 #

将请求头的"content-type": "application/x-www-form-urlencoded"替换为"Content-type": "application/json"，同时直接发送JSON字符串作为请求体（无需先解析再转字符串，直接对目标对象执行JSON.stringify()即可）。

示例客户端请求代码：

const data = { A: "a", B: "b", C: "c" };
fetch('/your-api-endpoint', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(data)
});

2. 服务端配置解析中间件 #

在server.js中添加express.json()中间件，用于自动解析application/json格式的请求体：

const express = require('express');
const app = express();

// 添加JSON解析中间件
app.use(express.json());

// 你的路由处理
app.post('/your-api-endpoint', (req, res) => {
  console.log(req.body); // 此时输出 { A: "a", B: "b", C: "c" }
  // 后续业务逻辑
});

配置完成后，服务端就能正常解析请求体，直接通过req.body.A、req.body.B等访问对应字段。

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