Vue Element-Plus上传组件向Express服务器传图，后端无法接收文件的问题求助

大家好，我现在在用Vue Element-Plus的Upload组件做图片上传到Express服务器的功能，但遇到了个棘手的问题——后端接收不到上传的文件。我把自己写的客户端和服务端代码贴出来，麻烦各位大佬帮忙看看哪里出问题了🙏

客户端代码 #

模板部分 #

<el-upload
  action="/"
  :auto-upload="false"
  :show-file-list="false"
  :on-change="uploadFile"
>
  <!-- 这里可以加上传触发按钮，比如 <el-button type="primary">点击上传图片</el-button> -->
</el-upload>

逻辑部分 #

const uploadFile = async (file) => {
  const formData = new FormData();
  formData.append("file", file);
  axios.post( `http://localhost:3000/api/v1/upload`, formData, {
    headers: {
      'Content-Type': 'multipart/form-data'
    }
  }).then(resp => {
    var rdata = resp.data
    console.log(rdata);
  }).catch(error => {
    console.log(error);
  });
}

服务端代码 #

import multer from "multer";
const upload = multer({
  dest: 'uploads'
})
productRoute.post(
  "/api/v1/upload",
  upload.single("file"),
  (req, res) => {
    console.log('upload 111', req.file);
    console.log('upload 222', req...
    // 后续代码未写完，但当前核心问题是req.file始终拿不到值
  }
)

我已经确认前端的FormData里确实添加了文件，请求也正常发送出去了，但后端打印的req.file一直是undefined，有没有大佬能帮我分析下可能的原因？

备注：内容来源于stack exchange，提问作者user824624