React Native Fetch 文件上传错误答案

【问题标题】：React Native Fetch File Upload ErrorReact Native Fetch 文件上传错误
【发布时间】：2017-05-25 11:00:21
【问题描述】：

我正在尝试使用 fetch 将图像文件上传到我的服务器。这是我正在使用的代码：

var formData = new FormData();
    formData.append('photo', {uri: './tempImageStore/image.jpg', name: 'photo', type: 'image/jpg'});

和

       <Button
         onPress={() => fetch('http://localhost:8000/upload', {
           method: 'POST',
           headers: {
             "Accept": "multipart/form-data",
             "Content-Type": "multipart/form-data"
           },
             body: formData
           })
         }
         title={'Upload File'}
       />

但是，当我运行我的应用并按下 Upload File 按钮时，我收到一条错误消息：

我不确定我做错了什么，或者这是否是将照片上传到服务器的正确方法。

【问题讨论】：

如果你不能让它工作：我对这个库很幸运。 RN Fetch Blob.
我更喜欢那个库，但我也遇到了一个错误：stackoverflow.com/questions/43835848/…

标签： react-native fetch-api

【解决方案1】：

是的，是否可以仅使用 fetch API 上传图片。

我遇到了同样的问题，我用这个解决了：

首先，请确保删除网址开头的file//，您可以这样做

const fileURL = "file:///Users/juordergonzalezquinonez/Library/Developer/CoreSimulator/Devices/046E9C13-5D5D-4463-82DD-256501874EBF/data/Containers/Data/Application/839C5E04-46BB-4F9B-BF53-3FDFF639F340/tmp/react-native-image-crop-picker/C07E6B9E-3113-41C2-AD80-A768DF33C263.jpg";
const cleanURL = fileURL.replace("file://", "");

然后在获取请求中，确保您的标头必须是这样的：

headers: {
  'Accept': 'application/json',
  'Content-Type': 'multipart/form-data;'
},

【讨论】：

我仍然能够上传带有“file://”前缀的文件。
在 Android 中您需要“file://”前缀，而在 IOS 中您必须删除“file://”前缀