Multer 从不同的输入上传多个文件

Question

我对 multer/node/express/mongoose/... 比较陌生，我目前正在尝试从具有相同名称的不同输入上传多个文件（我使用 reactjs 生成输入）。

这是我的 React 前端：

onSubmit = (e) => {

    e.preventDefault();

    const {imges} = this.state;
    let formData = new FormData();

    formData.append('imges', imges);

    axios.post('newuser',
        formData)
        .then(function (response) {
            console.log(response);
        })
        .catch(function (error) {
            console.log(error);
        });
}

handleFileChange(inputid, file) {
    const data = [...this.state.data];
    this.setState({
        imges: this.state.imges.concat(file)
    }, () => console.log(this.state.imges));
}

render() {
    return(
        <form onSubmit={this.onSubmit} encType="multipart/form-data">
            <Imageinput onhandleChange={this.handleFileChange}/>
        </form>
    )
}

我没有添加生成字段的方式，因为我觉得它与问题无关，但是，我想指出，用户可以生成许多带有名称的文件输入 -随心所欲地属性“图片”。

这是我的 node.js 后端：

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

    filename: (req, file, cb) => {
        const newFilename = `${uuidv4()}${path.extname(file.originalname)}`;
        cb(null, newFilename);
    },
})

const upload = multer({ storage: storage });
router.post("/", upload.array("picture"), (req, res) => {
    console.log(req.files + " and exit");
    res.end();
});

module.exports = router;

我也尝试过使用upload.any()，但它不起作用，我还了解到使用它可能存在安全隐患。我在这里有点困惑，到目前为止我看到的所有问题/答案都只需使用req.files，他们会收到一组文件或至少一些东西，但对我来说，终端只是打印出and exit，所以我我假设我的代码中有错误。 我还尝试将“图片 []”设置为我的输入的名称，因为在 php 中表示一个文件数组（我知道 php 不是 node.js，但我想在这里询问之前尽可能多地尝试） .

总结我的问题：我想使用 multer 从具有相同名称的不同输入的文件中检索文件数据。它不起作用，因此我想问是否有人知道我在这种情况下做错了什么以及如何解决它。

（编辑：这可能是一个小话题，但在我看来，这个问题太“小”，无法作为自己的问题提出。在我的表单中，我也有一些文本输入。在使用 multer 之前，我存储了从我的每个组件（Imageinput）收集的数据在它自己的数组中，状态如下：

 data : [{data1: value, imgsrc: value}, {data1: value, imgsrc: value}, ... ]

可以使用 multer 将图像作为该数组的一部分发送吗？ )。

Answer 1

const storage = multer.diskStorage({
    destination: function (req, file, cb) {
        cb(null, './client/uploads/')
    },
      filename: function (req, file, cb) {
        cb(null, Date.now() + '.' + file.originalname.split('.')[file.originalname.split('.').length - 1]) //Appending extension
    }
});

const Upload = multer({storage: storage}).any();

router.post('/', function (req, res) {
    Upload(req, res, function (err, filedata) {
        if (err) {
            res.json({error_code: 1, err_desc: err});

        } else {
            functionName(req.files, function (result) {
                            res.json(result);
            })
        }
       })
});