我无法通过REACT将图片上传到后端

时间:2019-11-19 12:25:07

标签: javascript reactjs spring

我会马上解决这个问题。

我在REACT中有这个简单的表格。它具有2个输入字段和1个图像上传字段。我需要将数据发送到使用Spring制作的后端API。

我现在正在尝试

const formID = document.getElementById('formGroup');
const formData = new FormData(formID);

fetch('api/5/add-image', {
  method: 'POST',
  body: JSON.stringify(formData),
  headers: {
    Authorization: 'Bearer ' + token,
    Accept: 'application/json',
    'Content-Type': 'multipart/form-data'
  }
}).then(res => {
   this.setState({ isSubmitting: false });
   console.log(res.text());
})

但是我不断在控制台中收到相同的错误消息

Required request part 'file' is not present

任何想法可能导致此问题?验证令牌的工作原理和标头都可以。

谢谢您的时间:)

1 个答案:

答案 0 :(得分:2)

在使用FormData和fetch时,您不应对表单值进行字符串化处理,也不要指定Content-Type标头

这应该做

const formID = document.getElementById('formGroup');
const formData = new FormData(formID);
fetch('api/5/add-image', {
  method: 'POST',
  body: formData,
  headers: {
    Authorization: 'Bearer ' + token,
    Accept: 'application/json',
  }
}).then(res => {
   this.setState({ isSubmitting: false });
   console.log(res.text());
})