FormData append后后端仅接收空对象问题排查求助

算力阿峰

2026-8-18

问题原因

你的后端当前仅配置了bodyParser.json()和bodyParser.urlencoded()，这两个中间件只能处理JSON格式和x-www-form-urlencoded格式的请求体，完全无法解析multipart/form-data类型的FormData，这就是后端接收到空对象的核心原因。

解决方案

需要使用专门处理multipart/form-data的中间件，最常用的是multer，步骤如下：

1. 安装multer

在项目根目录执行命令：

npm install multer

2. 修改后端配置与接口代码

方式一：仅处理普通文本字段（无文件上传）

如果当前只是提交普通文本数据（像你现在注释掉了文件上传部分），可以用multer().none()来解析所有文本字段：

修改后端index.js：

const app = express();
const multer = require('multer'); // 引入multer

app.use(morgan("dev"));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
// 添加multer中间件，用于解析无文件的FormData
app.use(multer().none());

之后你的createAgent接口就能正常获取req.body了：

exports.createAgent = async (req, res) => {
  console.log(req.body.first_name); // 现在能正常输出值
  console.log(req.body); // 不再是空对象
};

方式二：需要处理文件上传

如果之后要恢复文件上传（比如image字段），需要配置multer的存储方式，示例如下：

const multer = require('multer');
// 配置存储路径（这里用内存存储，也可以配置磁盘存储）
const storage = multer.memoryStorage();
const upload = multer({ storage: storage });

// 在路由中使用multer中间件，指定要处理的文件字段名
app.post('/api/create-agent', upload.single('image'), exports.createAgent);

此时接口中：