Question

我正在使用访存API执行照片上传，并且一直收到Type Error Network Request Error。我在模拟器和设备上收到相同的错误。我正在使用react-native-image-crop-picker作为照片上传数据的来源。有什么想法吗？

const handlePhotoUpload =  async (image: any, token: string) => {

      const { path, filename, mime } = image;

      const uri = path.replace("file://", "")
      const file = {
        uri,            
        type: mime,           
        name: filename             
      };

      const body = new FormData()
      body.append('file', file)

      const config = {
        method: 'POST', 
        headers: { 'Authorization': 'Bearer ' + token },
        body
      };

      return await fetch(`${<API URL>}/user/photo`, config)

}

Answer 1

我也遇到过同样的问题，它发生在Android中，但在IOS中效果很好。一世猜猜有关Flipper网络的问题。

我评论了一段时间 initializeFlipper（this，getReactNativeHost（）。getReactInstanceManager（））

在此文件中 / android / app / src / main / java / com / {your_project} /MainApplication.java

Answer 2

如果发送方式是Android，则说明方式有误。

正确的uri是：

uri: Platform.OS === "android" ? path : path.replace("file://", "")

Answer 3

以下步骤可帮助我解决相同的问题。以防万一，

在android / app / src / main / java / com / {yourProject} /MainApplication.java中评论以下行：
```
initializeFlipper(this, getReactNativeHost().getReactInstanceManager())
```
在android / app / src / debug / java / com / {yourProject} /ReactNativeFlipper.java中在第43行中注释：
```
builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
```

图片上传代码：

var formData = new FormData();
   formData.append('UserId', 'abc@abc.com');
   formData.append('VisitId', '28596');
   formData.append('EvidenceCapturedDate', '09/10/2019 13:28:20');
   formData.append('EvidenceCategory', 'Before');
   formData.append('EvidenceImage', {
     uri: Platform.OS === 'android' ? `file:///${path}` : `/private${path}`,
     type: 'image/jpeg',
     name: 'image.jpg',
   });
   axios({
     url: UrlString.BaseUrl + UrlString.imageUpload,
     method: 'POST',
     data: formData,
     headers: {
       Accept: 'application/json',
       'Content-Type': 'multipart/form-data'
     },
   })
     .then(function (response) {
       console.log('*****handle success******');
       console.log(response.data);

     })
     .catch(function (response) {
       console.log('*****handle failure******');
       console.log(response);
     });

Answer 4

我知道回复晚了，但可以帮助其他人

执行以下步骤

在您的项目目录中，单击android文件夹，然后打开gradle.properties并将其翻转器版本更改为此

FLIPPER_VERSION=0.47.0

在React Native Android上上传照片会产生Type Error Network Error

4 个答案: