Multer Zip文件上传：Postman正常，Next.js客户端req.file为空

可行解决方案： #

1. 正确配置请求Headers

Axios发送FormData时，不要手动设置Content-Type: multipart/form-data，否则会丢失浏览器自动生成的boundary分隔符，导致Multer无法解析请求体。修改请求代码：

const response = await axios.put(url, formData, {
  headers: {
    // 让浏览器自动生成带boundary的Content-Type
    ...formData.getHeaders()
  }
});

如果用原生fetch，同样无需手动设置Content-Type：

const response = await fetch(url, {
  method: 'PUT',
  body: formData
});

2. 确认File对象获取正确

检查文件输入控件的onChange事件是否正确拿到有效File对象：

// 示例文件输入控件
<input
  type="file"
  accept=".zip"
  onChange={(e) => setFile(e.target.files[0])}
/>

注意e.target.files是FileList集合，必须取第一个元素[0]，不能直接把整个FileList传给FormData。

3. 用POST请求模拟PUT（兼容部分后端配置）

部分服务器或中间件对PUT方法的multipart/form-data解析支持有限，可以通过POST请求加参数模拟PUT：

const formData = new FormData();
formData.append('zip', file);
formData.append('_method', 'PUT'); // 添加模拟PUT的参数

const response = await axios.post(url, formData, {
  headers: formData.getHeaders()
});

后端需要安装并启用method-override中间件：

const methodOverride = require('method-override');
app.use(methodOverride('_method'));

4. 检查后端中间件顺序

确保Multer中间件直接绑定在PUT路由上，且没有body-parser等中间件在Multer之前解析请求体——body-parser会消耗multipart数据，导致Multer无法获取：

// 错误示例：不要在Multer前使用body-parser处理multipart
// app.use(bodyParser.urlencoded({ extended: true }));

// 正确顺序：先挂载Multer中间件到目标路由
router.route('/:id')
  .put(upload.single('zip'), asyncHandler(async (req, res) => {
    console.log(req.file); // 此时应能正常获取文件
    res.status(200).json({ success: true });
  }));

5. 验证FormData内容

发送请求前打印FormData内容，确认文件已正确添加：

for (const [key, value] of formData.entries()) {
  console.log(key, value); // 应看到'zip'对应的File对象
}

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