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

Question

我试图通过Multer和NodeJS添加一张图片到MongoDB。完成多点存储的创建。基于Multer的中间件(称为upload)被插入POST请求中。但是当我执行POST请求时，req。文件未定义。原因是什么?

路线:

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

您只需将文件名称附加到表单:

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

但是你必须附加整个文件对象:

fd.append("articleImage", file);

Answer 2

似乎你只是张贴文件名称，而不是二进制数据。检查request .body. articleimage，你会得到它