通过 Multer、NodeJS 在 Mongo 中上传文件时出现问题

Question

我正在尝试通过 Multer 和 NodeJS 向 MongoDB 添加图片。 Multer 存储已创建。 POST 请求中插入了基于 Multer 的中间件 upload。但是当我执行POST请求时，req.file是undefined。这是什么原因？

路线：

const express = require('express');
const Menu = require("../models/menu");
const Image = require("../models/image");
const router = express.Router();
const multer = require("multer");

const storage = multer.diskStorage({
  destination: (req, file, cb) => {
      cb(null, "./images/");
  },
  filename: (req, file, cb) => {
      cb(null, file.originalname);
  }
});

const upload = multer({storage: storage});

const getMenu = (req, res) => {
    Menu
      .find()
      .then((menu) => res.status(200).json(menu))
      .catch((error) => console.log("Ops"));
  }


router.get('/api/menu', getMenu);

router.post("/upload", upload.single("articleImage"), (req, res) => {
  console.log("request----------------", req.file) // UNDEFINED
  // const image = new Image({
  //   articleImage: req.file.originalname
  // });
  // image
  //   .save()
  //   .then(() => res.json("Ok"))
  //   .catch((error) => console.log(error));
})

module.exports = router;

前台形式：

import axios from 'axios';
import React, { useState } from 'react';

const NewAdvertisement = () => {
    const [file, setFile] = useState(null);
    file && console.log(file.name);
    const onSubmit = (e) => {
        e.preventDefault();
        const fd = new FormData();
        fd.append("articleImage", file.name);
        console.log("fd", fd);
        axios
            .post("/upload", fd)
            // .then(res => console.log(res))
    }
    return (
        <form
            onSubmit = {onSubmit}
            encType="multipart/form-data"
        >
            <input type = "file" filename="articleImage" onChange = {e => setFile(e.target.files[0])}/>
            <button type = "submit">Submit</button>
        </form>     
    );
};

export default NewAdvertisement;

Answer 1

您仅将文件 name 附加到表单：

fd.append("articleImage", file.name);

但您必须附加整个文件对象：

fd.append("articleImage", file);

Answer 2

您似乎只是发布 file.name 这只是文件名而不是二进制数据。检查req.body.articleImage你会得到它

通过 Multer、NodeJS 在 Mongo 中上传文件时出现问题

Problem while Uploading File in Mongo via Multer, NodeJS

javascript

mongodb

node.js

express

multer