React Native 0.62.* [TypeError: Network request failed] on file upload

[abumostafa]

Please provide all the information requested. Issues that do not follow this format are likely to stall.

Description

After upgrading from 0.61.4 to 0.62.0 the app will not upload files anymore from Android (all other requests are working fine)

React Native version:

0.62.0

Steps To Reproduce

1. Install a fresh ReactNative app via CLI
2. Upload a file to the emulator
3. Try to upload a file using fetch

import Picker from "react-native-image-picker"
import {request, PERMISSIONS, RESULTS} from 'react-native-permissions';

class App extends React.Component {

  async componentDidMount() {

    try {
      await request(PERMISSIONS.ANDROID.WRITE_EXTERNAL_STORAGE)
      await Picker.launchImageLibrary({noData: true}, async (file) => {
        try {
           const body = new FormData()
           body.append("file", { type: file.type, size: file.fileSize, uri: `file://${file.path}`, name: file.fileName })
           const headers = { "content-type": "multipart/form-data", "accept": "application/json" }

          const req = await fetch("ANY_SERVER/upload/image", {
            method: "POST",
            headers,
            body
          })
          console.log(req.status)
        }  catch (e) {
          console.log(e)
        }
      })
    } catch (e) {
      console.log(e)
    }
  }

  render(){
    return <View/>
  }
}

Expected Results

The request should reach the server to upload the file

Snack, code example, screenshot, or link to a repository:

https://snack.expo.io/01W!bybf_ [Mon Apr 06 2020 21:29:18.704] LOG [TypeError: Network request failed]

[khushal87]

I am facing the same issue, for RN 0.62.0 and 0.62.1 throws this error: Network request filed. All requests work except for the image post

Same here. How did you solve it ? My app is running fine in release mode but not in build mode

[khushal87]

Whoever is still struggling with this issue. it's happening because of Flipper network plugin. I disabled it and things work just fine.

My workaround to make this work is commenting out line number 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);

in this file android/app/src/debug/java/com/maxyride/app/drivers/ReactNativeFlipper.java

You saved my day . Thanks a lot :) But is it safe to do so for future builds?

[karan-utility]

Hi, I am still getting the issue in 62.2. Solutions tried

1. android:usesCleartextTraffic="true" => Even my all other API working, also i have HTTP.
2. commenting out line number 43
3. no issue with "file://", => even without adding image, we just add json formdata still getting same error.

[ivanalexo]

Hi, I am still getting the issue in 62.2. Solutions tried

1. android:usesCleartextTraffic="true" => Even my all other API working, also i have HTTP.
2. commenting out line number 43
3. no issue with "file://", => even without adding image, we just add json formdata still getting same error.

@jamisonrachford try to do your request with XMLHttpRequest

[Oriole-Alex]

This problem is solved by upgrading Flipper in this file

/yourproject/android/gradle.properties Line 28

25  android.enableJetifier=true  
26  
27  # Version of flipper SDK to use with React Native 
28  FLIPPER_VERSION=0.41.0  //upgrade to latest flipper

See : facebook/flipper#993 (comment)

manually making FLIPPER_VERSION=0.41.0 instead of using the default FLIPPER_VERSION=0.33.1 with RN 0.62.2 causes the build to fail (attached image). Am I missing a step in upgrading the flipper version?

[gustavolsilvano]

I'm using expo. How can I solve this?

[pqminh]

This problem is solved by upgrading Flipper in this file

/yourproject/android/gradle.properties Line 28

25  android.enableJetifier=true  
26  
27  # Version of flipper SDK to use with React Native 
28  FLIPPER_VERSION=0.41.0  //upgrade to latest flipper

See : facebook/flipper#993 (comment)

Tks so much!

[liukefu2050]

This problem is solved by upgrading Flipper in this file

/yourproject/android/gradle.properties Line 28

25  android.enableJetifier=true  
26  
27  # Version of flipper SDK to use with React Native 
28  FLIPPER_VERSION=0.41.0  //upgrade to latest flipper

See : facebook/flipper#993 (comment) Thanks！ This problem bothered me for two days

[Hiti3]

I am using expo client, there has to be a solution for it? I am searching for days and no avail of success, can anyone please help me how we can achieve this in expo?

[gustavolsilvano]

@Hiti3 I'm using expo too. I also being searching for a solution. What I'm doing now is to send a base64 string (no formData) and decoding it at the server side:

Expo `import * as ImagePicker from 'expo-image-picker';

// Image picker export default async () => { const permission = await ImagePicker.requestCameraRollPermissionsAsync(); if (permission.granted === 'false') return 'denied'; const options = { allowsEditing: true, base64: true }; const result = ImagePicker.launchImageLibraryAsync(options); return result; }; `

Server side ` const sharp = require('sharp'); exports.uploadImage = async (req, res, next) => { const { image } = req.body; const { type: imageType, name: imageName, base64: imageBase64, path: imagePath, resize, } = image;

const base64Data = imageBase64.replace(data:image/${imageType};base64, '');

var img = new Buffer(base64Data, 'base64'); const path = __dirname + ./../../public/${imagePath}/${imageName};

if (resize) { try { await sharp(img) .resize(500, 500) .toFormat('jpeg') .jpeg({ quality: 90 }) .toFile(path); } catch (err) { console.log('write erro', err); } } if (!resize) { try { await sharp(img).toFormat('jpeg').jpeg({ quality: 90 }).toFile(path); } catch (err) { console.log('write erro', err); } } req.image = { imageType, imageName, imagePath }; next(); }; `

Help it helped. If you have any problem, please send me a message.

[Hiti3]

Thank you for the solution provided, this works as tested, I just want to be sure again before I jump ship and lose a day maybe. And you are uploading video or image if I understand correctly?

On Tue, 19 May 2020, 21:44 Gustavo Leite Silvano, notifications@github.com wrote:

@Hiti3 https://github.com/Hiti3 I'm using expo too. I also being searching for a solution. What I'm doing now is to send a base64 string (no formData) and decoding it at the server side:

Expo `import * as ImagePicker from 'expo-image-picker';

// Image picker export default async () => { const permission = await ImagePicker.requestCameraRollPermissionsAsync(); if (permission.granted === 'false') return 'denied'; const options = { allowsEditing: true, base64: true }; const result = ImagePicker.launchImageLibraryAsync(options); return result; }; `

Server side ` const sharp = require('sharp'); exports.uploadImage = async (req, res, next) => { const { image } = req.body; const { type: imageType, name: imageName, base64: imageBase64, path: imagePath, resize, } = image;

const base64Data = imageBase64.replace(data:image/${imageType};base64, '');

var img = new Buffer(base64Data, 'base64'); const path = __dirname + ./../../public/${imagePath}/${imageName};

if (resize) { try { await sharp(img) .resize(500, 500) .toFormat('jpeg') .jpeg({ quality: 90 }) .toFile(path); } catch (err) { console.log('write erro', err); } } if (!resize) { try { await sharp(img).toFormat('jpeg').jpeg({ quality: 90 }).toFile(path); } catch (err) { console.log('write erro', err); } } req.image = { imageType, imageName, imagePath }; next(); }; `

Help it helped. If you have any problem, please send me a message.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/28551#issuecomment-631041471, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACGFH2MSYJ2J5YDRASXISOTRSLOQFANCNFSM4MCRHIRA .

[NehaSixBerries]

0.41.0

Thank you so much.

This problem is solved by upgrading Flipper in this file /yourproject/android/gradle.properties Line 28

25  android.enableJetifier=true  
26  
27  # Version of flipper SDK to use with React Native 
28  FLIPPER_VERSION=0.41.0  //upgrade to latest flipper

See : facebook/flipper#993 (comment)

Tks so much!

[gustavolsilvano]

@Hiti3 Just image. But I think that you can upload videos too.

[gabrielmartinez]

Thanks @alfianwahid but I used FLIPPER_VERSION=0.44.0

[dharmendrashah]

i used to have the same problem, i tried every thing and and stuck on this for 4-5 days then i use RN-FETCH-BLOB package it really solved the problem of sending the files. use it you will never regret

[nharis7]

After applying both of the above fixes, I am still getting Network request failed. In my case file getting updated on the server but it gives the error.

[dharmendrashah]

may be its a problem of the way you sending the data

[nharis7]

may be its a problem of the way you sending the data

I am looking into it. But if the method of sending is not correct then why the data is getting updated on the server.

[tamangsuresh]

I have try every solution but no any success on android. I'm using 0.62.2

[Brianop]

@tamangsuresh Hey man, did you find a fix for this ?

[tamangsuresh]

@Brianop no man

[liyuewen]

感谢说升级Flipper的，我解决了

[maneesha-krishna]

Hey, did anyone solved the issue ?, i am facing the same problem.

[liyuewen]

嘿，有人解决了这个问题吗？，我也面临着同样的问题。 You need to upgrade flipper to the latest

[tamangsuresh]

@liyuewen i have upgrade flipper in RN project and flipper too. But no any success.

[liyuewen]

@liyuewen 我在RN项目中也有鳍状肢的升级和鳍状肢。但是没有任何成功。

After the upgrade, you need to clear the Android cache

[tamangsuresh]

@liyuewen I have done that too. But no any luck.

[nharis7]

This problem is solved by upgrading Flipper in this file

/yourproject/android/gradle.properties Line 28

25  android.enableJetifier=true  
26  
27  # Version of flipper SDK to use with React Native 
28  FLIPPER_VERSION=0.41.0  //upgrade to latest flipper

See : facebook/flipper#993 (comment) In my project flipper version is available on this location D:\myProject\node_modules\react-native\template\android\gradle.properties. I have updated flipper in the gradle at this location and the other gradle.properties which is located at /myProject/android/gradle.properties. Also data gets updated on the server and I have test it in Postman too working fine in Postman. I also have commented the code told by @abumostafa

[liyuewen]

@liyuewen 我也做到了。但没有任何运气。

My version is "react native": "^ 0.62.2", which is successful in the future

[ithustle]

Updating Flipper to 0.45, solve the problem

[NSR88]

I am not using Flipper anywhere, still having the same issue :(

[Hiti3]

I am not using Flipper anywhere, still having the same issue :(

Same here, using Expo.. This shouldn't be such an issue for so many people, especially when using managed workspace where the feature is ambiguously presented as a working function.

[navin-d97]

Anyone has updates on this issue. I have tried upgrading flipper, commenting out flipper in mainactivity. Still having this issue in android. Returns [TypeError: network request failed]. But same code works fine in iOS

[navin-d97]

Anyone has updates on this issue. I have tried upgrading flipper, commenting out flipper in mainactivity. Still having this issue in android. Returns [TypeError: network request failed]. But same code works fine in iOS

initializeFlipper(this, getReactNativeHost().getReactInstanceManager());

Removing this line in MainApplication.java works. Issue is still there in debug build. but it works in release build.

[nharis7]

Anyone has updates on this issue. I have tried upgrading flipper, commenting out flipper in mainactivity. Still having this issue in android. Returns [TypeError: network request failed]. But same code works fine in iOS

initializeFlipper(this, getReactNativeHost().getReactInstanceManager());

Removing this line in MainApplication.java works. Issue is still there in debug build. but it works in release build.

Thanks, I never tried testing in release build. I'll try that today.

[arthedza]

I have react-native v59. So, what can people who don't use the Flipper do? Are any updates?

[jimberlage]

Here's all the relevant data I could think to pull from my app. I'm experiencing the same problem, on the iOS simulator.

RN 0.62.2, Flipper 0.46.0, on an ejected Expo app.

  // Turn the recording into a multipart form request with recording = the contents of our file.
  let fileUri = recording.getURI();
  if (!fileUri) {
    throw new Error('fileUri is null, it should always be initialized before reaching this point.');
  }

  let body = new FormData();
  body.append('recording', {
    uri: fileUri,
    name: 'voice-command.mp4',
    type: 'audio/mp4'
  });

  // Kick off the transcription job.
  var response;
  try {
    response = await fetch(
      'http://localhost:5000/api/v0/commands/transcription/start',
      {
        method: 'POST',
        headers: {
          'Accept': 'application/json',
        },
        body,
      },
    );
  } catch (error) {
    console.error(error);
    throw error;
  }

TypeError: Network request failed http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:32085:31 dispatchEvent@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:34645:31 setReadyState@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:33729:33 didCompleteResponse@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:33556:29 emit@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:9744:42 callFunction@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:5491:49 http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:5213:31 __guard@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:5445:15 callFunctionReturnFlushedQueue@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:5212:21 callFunctionReturnFlushedQueue@[native code]

Info.plist is set up to allow localhost requests.

    <key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
        <key>NSExceptionDomains</key>
        <dict>
            <key>localhost</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
        </dict>
    </dict>

My package.json:

{
  "name": "EstimateMobileApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "react-native start",
    "ios": "react-native run-ios",
    "android": "react-native run-android",
    "test": "jest"
  },
  "dependencies": {
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/native": "^5.4.2",
    "@react-navigation/stack": "^5.3.9",
    "@types/react-native-vector-icons": "^6.4.5",
    "expo": "^37.0.12",
    "expo-av": "^8.1.0",
    "react": "^16.11.0",
    "react-native": "^0.62.2",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-reanimated": "^1.8.0",
    "react-native-safe-area-context": "^1.0.2",
    "react-native-screens": "^2.7.0",
    "react-native-unimodules": "^0.9.1",
    "react-native-vector-icons": "^6.6.0",
    "tailwind-rn": "^1.1.0"
  },
  "devDependencies": {
    "@babel/core": "^7.9.0",
    "@babel/runtime": "^7.9.0",
    "@react-native-community/eslint-config": "^0.0.5",
    "@types/jest": "^25.2.3",
    "@types/react": "^16.9.35",
    "@types/react-native": "^0.62.10",
    "@types/react-test-renderer": "^16.9.2",
    "babel-jest": "^24.9.0",
    "eslint": "^6.5.1",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.58.0",
    "react-test-renderer": "16.11.0",
    "tailwindcss": "^1.4.6",
    "typescript": "^3.9.3"
  },
  "jest": {
    "preset": "react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|react-(native|universal|navigation)-(.*)|@react-native-community/(.*)|@react-navigation/(.*))"
    ]
  }
}

And my Podfile:

platform :ios, '10.0'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
require_relative '../node_modules/react-native-unimodules/cocoapods.rb'

def flipper_pods()
  flipperkit_version = '0.46.0'
  pod 'FlipperKit', '~>' + flipperkit_version, :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitLayoutPlugin', '~>' + flipperkit_version, :configuration => 'Debug'
  pod 'FlipperKit/SKIOSNetworkPlugin', '~>' + flipperkit_version, :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitUserDefaultsPlugin', '~>' + flipperkit_version, :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitReactPlugin', '~>' + flipperkit_version, :configuration => 'Debug'
end

# Post Install processing for Flipper
def flipper_post_install(installer)
  file_name = Dir.glob("*.xcodeproj")[0]
  app_project = Xcodeproj::Project.open(file_name)
  app_project.native_targets.each do |target|
    target.build_configurations.each do |config|
      cflags = config.build_settings['OTHER_CFLAGS'] || '$(inherited) '
      unless cflags.include? '-DFB_SONARKIT_ENABLED=1'
        puts 'Adding -DFB_SONARKIT_ENABLED=1 in OTHER_CFLAGS...'
        cflags << '-DFB_SONARKIT_ENABLED=1'
      end
      config.build_settings['OTHER_CFLAGS'] = cflags
    end
    app_project.save
  end
  installer.pods_project.targets.each do |target|
    if target.name == 'YogaKit'
      target.build_configurations.each do |config|
        config.build_settings['SWIFT_VERSION'] = '4.1'
      end
    end
  end
  installer.pods_project.save
end

target 'EstimateMobileApp' do
  # Pods for EstimateMobileApp
  pod 'FBLazyVector', :path => "../node_modules/react-native/Libraries/FBLazyVector"
  pod 'FBReactNativeSpec', :path => "../node_modules/react-native/Libraries/FBReactNativeSpec"
  pod 'RCTRequired', :path => "../node_modules/react-native/Libraries/RCTRequired"
  pod 'RCTTypeSafety', :path => "../node_modules/react-native/Libraries/TypeSafety"
  pod 'React', :path => '../node_modules/react-native/'
  pod 'React-Core', :path => '../node_modules/react-native/'
  pod 'React-CoreModules', :path => '../node_modules/react-native/React/CoreModules'
  pod 'React-Core/DevSupport', :path => '../node_modules/react-native/'
  pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS'
  pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation'
  pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob'
  pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image'
  pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS'
  pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network'
  pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings'
  pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text'
  pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration'
  pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native/'

  pod 'React-cxxreact', :path => '../node_modules/react-native/ReactCommon/cxxreact'
  pod 'React-jsi', :path => '../node_modules/react-native/ReactCommon/jsi'
  pod 'React-jsiexecutor', :path => '../node_modules/react-native/ReactCommon/jsiexecutor'
  pod 'React-jsinspector', :path => '../node_modules/react-native/ReactCommon/jsinspector'
  pod 'ReactCommon/callinvoker', :path => "../node_modules/react-native/ReactCommon"
  pod 'ReactCommon/turbomodule/core', :path => "../node_modules/react-native/ReactCommon"
  pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga', :modular_headers => true

  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'

  target 'EstimateMobileAppTests' do
    inherit! :complete
    # Pods for testing
  end

  use_native_modules!
  use_unimodules!

  flipper_pods()
  post_install do |installer|
    flipper_post_install(installer)
  end
end

target 'EstimateMobileApp-tvOS' do
  # Pods for EstimateMobileApp-tvOS

  target 'EstimateMobileApp-tvOSTests' do
    inherit! :search_paths
    # Pods for testing
  end
end

[navin-d97]

I have react-native v59. So, what can people who don't use the Flipper do? Are any updates?

I didn't have this issue in previous versions. Your issue might be something different I think. Are you using https url?

[arthedza]

I have react-native v59. So, what can people who don't use the Flipper do? Are any updates?

I didn't have this issue in previous versions. Your issue might be something different I think. Are you using https url?

Yep, https. Are there any limitations for the formData object in RN, for example, it could be a string length or formData size? It looks like the RN intercept this request and throws this error

[navi-d97]

I have react-native v59. So, what can people who don't use the Flipper do? Are any updates?

I didn't have this issue in previous versions. Your issue might be something different I think. Are you using https url?

Yep, https. Are there any limitations for the formData object in RN, for example, it could be a string length or formData size? It looks like the RN intercept this request and throws this error

I am not aware of any such limitations. Can you share the code? And did this work on iOS?

[arthedza]

I need to reach such request body structure:

{
    "user_uuid":"9a137...",
    "contract_uuid":"881d9...",
    "files":[
        {"document_type_id":"20","document_type_title":"test1","private_flag":"0","file":{}},
        {"document_type_id":"21","document_type_title":"test2","private_flag":"1","file":{}},
        {"document_type_id":"22","document_type_title":"test3","private_flag":"1","file":{}}
    ]
}

where the file is a JS file object with name, type, uri, size, etc. fields

const fileArrayToSend = await Promise.all(
            fileSelect.map(async (file, index) => {
                const documentTypeNum = Number(documentType[index]) || 0;

                return {
                    document_type_id: documentTypeNum,
                    document_type_title: customType ? customType[index] : null,
                    private_flag: isPrivate[index] ? 1 : 0,
                    file: {
                        name: file.name, 
                        type: file.type,
                        uri: file.uri, 
                        size: file.size
                    }
                };
            })
        );
let body = {
    contract_uuid: contract.uuid,
    user_uuid: userUUID
};

const formData = new FormData();
const appendToFormData = (formData, object) => {
    for (let [key, value] of Object.entries(object)) {
        if (value) {
            formData.append(key, value);
        }
    }
};
appendToFormData(formData, body);

fileArrayToSend.forEach((file, index) => {
    formData.append(`files[${index}]`, file, file.file.name);
});
let response = await Axios.post(`${config.apiEndpoint}/store_document_request_action`, formData, {
    headers: { 'Content-Type': 'multipart/form-data' }
});

[dmobisoft]

I had same this issue in my project with react-native version 0.62. I updated flipper to "0.41.0" and it worked. In gradle.properities FLIPPER_VERSION=0.41.0

[nharis7]

I had same this issue in my project with react-native version 0.62. I updated flipper to "0.41.0" and it worked. In gradle.properities FLIPPER_VERSION=0.41.0

Can you please mention the path of gradle.properties, gradle.properties in android do not contain flipper version. But gradle.properties in react android folder have flipper version.

[dmobisoft]

@nharis7 it's in /android/gradle.properties But what's your version of react-native? flipper is only in react-native version 0.62 and above. There's no flipper in old versions.

[nharis7]

@nharis7 it's in /android/gradle.properties But what's your version of react-native? flipper is only in react-native version 0.62 and above. There's no flipper in old versions.

Currently I am on 0.62.2 and I have upgraded my project from 0.61 in my /android/gradle.properties. I have created a new project with it now I can see flipper version in /android/gradle.properties. I'll migrate all my stuff to new project and will see if this issues gets solved or not.

[sarmadkung]

THIS SOLUTION WORKED FOR ME https://github.com/axios/axios/issues/1567#issuecomment-518118223

[Guuz]

Upgrading flipper fixes it! (i upgraded to 0.46.0)

[12343954]

I tried all the way above! only upgrade flipper to 0.46 can fix it!

"dependencies": {
    "@react-native-community/async-storage": "^1.11.0",
    "@react-native-community/cameraroll": "^1.7.2",
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/drawer": "^5.8.1",
    "@react-navigation/material-bottom-tabs": "^5.2.9",
    "@react-navigation/native": "^5.5.0",
    "@react-navigation/stack": "^5.4.1",
    "axios": "^0.19.2",
    "mime-types": "^2.1.27",
    "path": "^0.12.7",
    "query-string": "^6.13.1",
    "react": "16.11.0",
    "react-native": "0.62.2",
    "react-native-animatable": "^1.3.3",
    "react-native-animate-loading-button": "^1.0.3",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-image-picker": "^2.3.1",
    "react-native-image-resizer": "^1.2.3",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-paper": "^3.10.1",
    "react-native-reanimated": "^1.9.0",
    "react-native-safe-area-context": "^3.0.2",
    "react-native-screens": "^2.8.0",
    "react-native-swiper": "^1.6.0",
    "react-native-vector-icons": "^6.6.0"
  },

[Dtesch9]

This problem is solved by upgrading Flipper in this file

/yourproject/android/gradle.properties Line 28

25  android.enableJetifier=true  
26  
27  # Version of flipper SDK to use with React Native 
28  FLIPPER_VERSION=0.41.0  //upgrade to latest flipper

See : facebook/flipper#993 (comment)

It worked pretty well, that solved the problem on android, thank u so much.

[ArtToledo]

Eu enfrentei o mesmo problema, isso acontece no Android, mas funciona bem no IOS. Eu acho que esta questão sobre a Rede Flipper.

Por enquanto, comentei initializeFlipper(this, getReactNativeHost().getReactInstanceManager())

neste arquivo /android/app/src/main/java/com/{your_project}/MainApplication.java

It worked for me :)