Express 在React Native中使用Fetch而不是XMLHttpRequest

我试图通过以下方式将图像从我的react原生应用程序上传到S3，并改编了heroku的指南：

实际上，我在express.js后端使用aws sdk生成预签名请求，以便从react native将图像上载到S3

一切都很好，所以我尝试将XMLHttpRequests转换为fetch请求，react native似乎更喜欢这些请求。转换后，文件仍将上载到S3，但当我单击图像链接时，图像不会正确显示，而是显示一个空方块：

更具体地说，似乎是这段代码转换导致了这种情况的发生：

发件人：

致：

正在上载的文件对象：

  {
    name: "profileImage",
    type: "image/jpeg",
    uri: 'data:image/jpeg;base64,' + response.data, //just a base64 image string
    isStatic: true
  }

---

有人能解释一下为什么会发生这种情况，或者有过类似的经历吗？非常感谢

在fetch示例中，您将一个JSON字符串放在身体中。它将被发送到S3，但不会被解释为图像上传。您应该能够自己构造一个对象并将其作为请求主体传递给fetch，但我认为使用XHR是更简单的选择。据报道，这也是Facebook所做的（这条评论已经有一年多了）

---

如果可能，您还应该尝试使用本地URI，而不是传递Base64编码的数据。在JS和本机之间传输几MB的图像数据需要相当长的时间。

谢谢Daniel，我按照您的建议尝试使用FormData和本地URI，但结果仍然与以前一样，现在S3将内容类型解释为多部分/表单数据。传输什么时候发生，Daniel？我必须针对需要base64编码图像的后端进行集成。是因为JS必须通过桥读取图像才能将其转换为Base64吗？

_uploadFile(file, signedRequest, url) {
  let option = {
    method: "PUT",
    headers: {
      "Content-Type": "image/jpeg",
    },
    body: JSON.stringify(file)
  }

  fetch(signedRequest, option)
    .then(res => console.log("UPLOAD DONE"))
    .catch(err => console.log("ERROR UPLOADING: ", err))
}

  {
    name: "profileImage",
    type: "image/jpeg",
    uri: 'data:image/jpeg;base64,' + response.data, //just a base64 image string
    isStatic: true
  }