react-native 上傳文件時報錯，Network request failed

報錯情景：

　　版本：

"react": "16.13.1",
"react-native": "0.63.2",

　　fetch的其他請求都可以，但是上傳文件報錯。其實，查找文檔可知，0.62.0版本以上都有這個問題。代碼回滾到RN 0.61.5版本就不會有以上問題。

　　報錯內容： 請求沒有到后台，報錯 ‘Network request failed’

問題出現原因：

　　Flipper Network構建initializeFlipper時出現的問題。

解決辦法：

　　（1）Flipper Network構建initializeFlipper時出現的問題。   

　　　　找到/android/app/src/main/java/com/{your_project}/MainApplication.java

　　　　將initializeFlipper(this, getReactNativeHost().getReactInstanceManager())注釋

NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
      NetworkingModule.setCustomClientBuilder(
          new NetworkingModule.CustomClientBuilder() {
            @Override
            public void apply(OkHttpClient.Builder builder) {
     //        builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
            }
         });

　　或者找到android/app/src/debug/java/com/**/ReactNativeFlipper.java文件注釋43行

　　

38 NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
39      NetworkingModule.setCustomClientBuilder(
40          new NetworkingModule.CustomClientBuilder() {
41            @Override
42            public void apply(OkHttpClient.Builder builder) {
43      //        builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
44            }
45          });
46      client.addPlugin(networkFlipperPlugin);

　　（2）Flipper 已經在0.39.0版本修復了問題的一部分，之所以說是一部分，是因為我升級到0.39.0+以后仍有問題，我測試到升級Flipper 0.51.2仍然報錯，但是解決了部分人的問題，比如RN0.62.0版本。

　　　　Flipper升級方法：

　　　　轉到android/gradle.properties並添加此行

FLIPPER_VERSION=0.52.1

　　　　同時在android/app/build.gradle其中包含以下幾行

dependencies {
    // ....

    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
      exclude group:'com.facebook.fbjni'
    }

    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.flipper'
    }

    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.flipper'
    }

    // ...
}

　　（3）如果有人在RN 0.62或更高版本中仍然遇到問題，解決方案是：必須提供uri，名稱和要上載的媒體類型。

　　

formData.append('media_incident', {
          uri: image.path,
          type: image.mime,
          name: 'filename.jpg',
        });

　　8個小時解決了這個問題!!!

　　如果解決了您的問題，麻煩點個贊被！

　　Enjoy Coding,enjoy life!（原創）