Question

我在通过函数传递groupId到函数中遇到麻烦，基本上我是上传图片，但是我需要在其他函数上传递groupId来重命名图片，使用react和express来做到这一点：

  onFormSubmit = async (event) => {
    event.preventDefault();
    const { imageFile, currentGroupId } = this.state;
    var formData = new FormData();
    formData.append('groupImage', imageFile);
    const config = {
      headers: {
        'content-type': 'multipart/form-data'
      }
    };
    await api.post('/fileUpload/group', { currentGroupId }, formData, config );
  }

我的路线：

router.post('/group', (req, res) => {
  fileuploadmanager.uploadFile(req, res);
});

以及后端：

uploadFile(req, res) {
    const { uploadsPath } = this.porperties;
    const { currentGroupId } = req.body;//it prints but formData and config never comes here
    console.log("GROUP: ", currentGroupId);
    const storage = multer.diskStorage({
      destination: uploadsPath,
      filename: (req, file, cb) => {
        cb(null, `${file.fieldname}-${Date.now()}${path.extname(file.originalname)}`);
      },
    });

    const upload = multer({
      storage,
      limits: {
        fileSize: 1000000,
      },
      fileFilter: (req, file, cb) => {
        this.checkFileType(file, cb);
      },
    }).single('groupImage');

    upload(req, res, (err) => {
      if (err) {
        console.log(err);
      }
    });
  }

仅发送formData和config即可，但是如果我向端点添加groupId则不起作用。我尝试将其值附加到formData中，但是我无法在后端获得它，所以现在我尝试将其作为req.body传递，它可以正常工作，但我的其他参数没有传递到后端。 / p>

如何将我的groupId，formData和config传递给后端？

编辑：api是用于指定我的后端URL的包装器。我正在使用axios

import axios from 'axios';

export default axios.create({
  baseURL: process.env.REACT_APP_API_URL  
});

参考文献：

How to send data correct axios Error: Multipart: Boundary not found

Answer 1

尝试将所有数据发送到一个对象await api.post('/fileUpload/group', { currentGroupId, formData, config });中然后在uploadFile(req, res) { const postData = req.body;中获取数据；这应该可以解决问题。

通过POST将额外的值传递给另一个函数

1 个答案: