Node.js中Multer无法获取文件，图片上传失败求助

我看了你的代码，发现几个关键问题导致图片上传失败，req.file一直是undefined，咱们一步步来解决：

1. Multer FileFilter里的属性拼写错误 #

你在fileFilter里写了file.mimeType，但multer里正确的属性名是**file.mimetype**（注意是小写的t）！这个小错误直接导致所有图片都被判定为不符合条件，multer直接跳过了文件处理流程，自然req.file就是undefined，连diskStorage里的日志都不会执行。

修改后的fileFilter代码：

const fileFilter = (req, file, cb) => {
  if (
    file.mimetype === "image/png" ||
    file.mimetype === "image/jpg" ||
    file.mimetype === "image/jpeg"
  ) {
    cb(null, true);
  } else {
    cb(null, false);
    // 可以加上这句，主动提示用户文件类型错误
    // cb(new Error("仅支持PNG/JPG/JPEG格式的图片！"), false);
  }
};

2. 前端请求必须用multipart/form-data编码 #

你的后端配置了bodyParser.json()，但文件上传不能用JSON格式发送，必须用multipart/form-data编码：

• 如果是HTML表单，要加上enctype="multipart/form-data"：

  <form action="/posts" method="POST" enctype="multipart/form-data">
    <input type="text" name="title">
    <textarea name="content"></textarea>
    <input type="file" name="image" accept="image/png, image/jpeg, image/jpg">
    <button type="submit">提交</button>
  </form>
  

• 如果是AJAX请求（比如用axios/fetch），要创建FormData对象来传数据：

  const formData = new FormData();
  formData.append('title', '你的文章标题');
  formData.append('content', '你的文章内容');
  formData.append('image', document.querySelector('input[type="file"]').files[0]);
  
  // 用axios发送的示例
  axios.post('/posts', formData);
  

3. 确认文件字段名完全匹配 #

你用了multer(...).single("image")，这意味着前端表单里的文件输入框name属性必须是image，和这里的参数完全一致，否则multer识别不到上传的文件。

4. 检查images文件夹是否存在 #

multer不会自动创建目标文件夹，如果你的项目根目录下没有images文件夹，上传时会静默失败。可以手动创建，或者在代码里加一段自动创建的逻辑：

const fs = require('fs');
const path = require('path');

const imagesDir = path.join(__dirname, 'images');
if (!fs.existsSync(imagesDir)) {
  fs.mkdirSync(imagesDir);
}

最后，恢复图片检查的逻辑 #

你之前注释掉了这段代码，建议恢复，这样可以在用户没传图片时主动抛出错误，提前拦截问题：

if (!req.file) {
  const error = new Error("请上传图片！");
  error.statusCode = 422;
  throw error;
}

按照上面的步骤修改后，应该就能解决req.file为undefined的问题了。

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