向Node.js接口上传图片报MulterError: Unexpected field错误如何解决？

错误根因 #

你遇到的MulterError: Unexpected field是Multer的内置报错，触发原因是表单文件字段名和后端配置不匹配：
你的接口代码中使用upload.single('file')指定了该接口仅接收字段名为file的单个上传文件，而你在Postman中上传图片时填写的表单字段名不是file，Multer识别到不在预期内的文件字段就会抛出该错误。

解决方案 #

方案1：调整Postman配置（无需修改后端代码，推荐） #

在Postman对应请求的Body页签中：

• 选择form-data格式
• 新增一条行数据，Key列填写file，点击Key列右侧的下拉框选择类型为File
• 在Value列选择你要上传的本地图片，重新发起请求即可

方案2：修改后端配置匹配现有Postman字段 #

如果你不想调整Postman配置，只需将接口代码中upload.single('file')的入参替换为你当前Postman中填写的文件字段名即可。比如你Postman里文件字段名填的是logo，修改后代码如下：

Router.post('/logo', upload.single('logo'), (req, res) => {
    console.log("working");
    res.send("done");
});

额外注意事项 #

后续如果用前端代码调用该接口，构造FormData时添加文件的字段名也要和后端保持一致，示例代码如下：

const formData = new FormData();
// 第三个参数可选，用于指定上传文件名
formData.append('file', imageFile, 'test.png');
fetch('http://localhost:3001/databaseGym/logo', {
  method: 'POST',
  body: formData
})

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