我正在尝试使用 multer 将文件上传到后端，但由于某种原因它不起作用？

Question

这是前端代码

我使用 axios 和 FormData 发送文件，使用 profilePic 作为 FieldName 文件将发送到后端，但由于某种原因文件没有被存储！！

我不明白为什么！

const Addpost = () => {

  const onFileInput = async (e) => {

      const reqFnc = async (form) => {
        const config = {
          headers: {
              'Content-Type': 'multipart/form-data'
          }
      }

        try {

          const res = await axios.post('http://localhost:8000/api/blog/addpost', form, config)
          
          return res
        } catch (err) {
          console.log(err)
        }
      }
      

        const FilesArray = [...e.target.files]

        if (FilesArray.length === 1) {
          form.append('profilePic', FilesArray[0])
          const res = await reqFnc(form)
          console.log(res)
          return console.log("single")
        }
        
        if (FilesArray.length > 1) {          
          FilesArray.forEach((file, i) => {
              form.append('profilePic', file)
              const res = await reqFnc(form)

              console.log(res)            
          })
          return console.log("multiple")
        }

        console.log(FilesArray)
    }

// Component's Returned JSX 
return (
      <form className="ui form" encType="multipart/form-data" onSubmit={onFormSubmit} >
       <div className="two fields">
        <div className="field">
        <input type="file" name="profilePic" id="imageUpload" multiple style={{display: 'none'}} onChange={e => onFileInput(e)}/>
            <label htmlFor="imageUpload">
                <div className="ui animated fade button blue" tabIndex={0}>
                    <div className="visible content">Upload Image</div>
                    <div className="hidden content">
                    <i className="upload icon"></i>
                    </div>
                </div>
            </label>
        </div>
        <button className="ui button green" type="submit">Submit</button>
      </form>
    );

}
    

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

这是后端代码（Node js）

形成前端，它应该接收一个文件，profilePic，因为它是 FieldName 但它没有收到任何具有该字段名称的文件

我不明白为什么！

const Storage = multer.diskStorage({
    dest: './uploads', 
    filename: function (req, file, cb) {
      cb(null,  Date.now() + '__' + file.originalname)
    }
  })

  const upload = multer({ storage: Storage }).single('profilePic')

router.post('/addposts', (req, res) => {
    upload(req, res, err => {
        if (err) {
            return res.status(500).send('Error Uploading video')
        }
        res.status(200).send('File uploaded successfully !')
    })
          
});