我正在尝试在 node.js 后端使用 multer 上传文件并在前端响应 js，但在 public 文件夹中使用 multer 在后端不起作用

Question

React.js 的前端看起来不错我看到其他人和我做同样的事情但我不知道问题出在哪里！谁能帮帮我？

    const [cours, setCours] = useState([]);
    const [description, setDescription] = useState("")
    const [title, setTitle] = useState("")
    const coursHandle = (e) => { setCours([e.target.files]) }

    const onsubmit = async (e) => {
       e.preventDefault();

       const formData = new FormData();
       formData.append("description", description);
       formData.append("title", title);
       // cours.forEach((elem) => { formData.append("cours", elem) });
       formData.append("cours", cours)
       // for (let i = 0; i < cours.length; i++) {
       //     formData.append("cours", cours[i])
       // }
       await axios.post("http://localhost:5000/upload", formData)
           .then((res) => console.log("successfully file post", res)).catch((err) => 
            console.log("error with file post", err))
   }

multer 的后端在这里这个代码在我的 app.js app.use(express.static(path.join(__dirname, 'public'))); 并且 public 文件夹与 app.js

位于同一位置

const multer = require("multer");
const path = require("path");

const MIME_TYPES = {
    "file/pdf": "pdf",
    "file/docx": "docx",
    "file/txt": "txt",
    "file/png": "png",
    "file/jpeg": "jpg",
    "file/jpg": "jpg",
}

const fileStorage = multer.diskStorage({
    destination: (req, file, cb) => {
        cb(null, "public");
    },
    filename: (req, file, cb) => {
        const nameObject = path.parse(file.originalname);
        // const nameObject = file.originalname.split(' ').join('_');
        const extension = MIME_TYPES[file.mimetype];
        cb(null, nameObject.name.split(" ").join("_") + Date.now() + "." + extension);
    }
})

module.exports = { multerUpload: multer({ storage: fileStorage }).single("file") }

Answer 1

最后一行

module.exports = { multerUpload: multer({ storage: fileStorage }).single("file")

single 下的参数是 file，但在您的前端表单中没有名称文件的输入，也许您必须将 single 函数的参数从 file 更改为 cours

Answer 2

我找到了问题的答案，

formData.append("cours", cours)

这里我尝试发送的密钥名称是“cours”并且：

module.exports = { multerUpload: multer({ storage: fileStorage }).single("file")

这里单个函数的键名是“文件”！！这是第一个问题，另一个是这个：

我忘记在我的标签中添加这行了！

encType="multipart/form-data"

最后我的 multer js 是：

const fileStorage = multer.diskStorage({
    destination: (req, file, cb) => {
        cb(null, "public/files");
    },
    filename: (req, file, cb) => {
        console.log("filename :", file);
        const nameObject = path.parse(file.originalname);
        cb(null, nameObject.name.split(" ").join("_") + Date.now() + 
     nameObject.ext);
   }
})

module.exports = { multerUpload: multer({ storage: fileStorage }).array("cours") }

我正在尝试在 node.js 后端使用 multer 上传文件并在前端响应 js，但在 public 文件夹中使用 multer 在后端不起作用

I'm trying to upload files with multer in node.js backend and react js in frontend but it doesn't work in back side with multer in public folder

javascript

node.js

reactjs

multer