Skip to content

react-native fetch() method not working for HTTPS requests but is working with HTTP requests [Android] #25471

Closed
@ramonvermeulen

Description

@ramonvermeulen

When using the fetch() method with HTTPS I am getting a TypeError: Network request failed. I've tested this with different HTTP and HTTPS API's. I did test this on android only because I don't have an iOS device at the moment.

Example code:

  try {
    const res2 = await fetch(`http://www.mocky.io/v2/5d1c6ba4340000ad67b5fd58`);
    console.log(await res2.json()); // logs a fine response
  } catch (error) {
    console.log(error);
  }
  try {
    const res2 = await fetch(`https://www.mocky.io/v2/5d1c6ba4340000ad67b5fd58`);
    console.log(await res2.json());
  } catch (error) {
    console.log(error); // logs the error
  }

The error message:

TypeError: Network request failed
    at XMLHttpRequest.xhr.onerror (whatwg-fetch.js:504)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:580)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:394)
    at XMLHttpRequest.js:507
    at RCTDeviceEventEmitter.emit (EventEmitter.js:189)
    at MessageQueue.__callFunction (MessageQueue.js:366)
    at MessageQueue.js:106
    at MessageQueue.__guard (MessageQueue.js:314)
    at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:105)

React Native version:

$ react-native info
info 
  React Native Environment Info:
    System:
      OS: Linux 4.18 Ubuntu 18.10 (Cosmic Cuttlefish)
      CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
      Memory: 919.79 MB / 15.40 GB
      Shell: 4.4.19 - /bin/bash
    Binaries:
      Node: 11.10.1 - /usr/local/bin/node
      npm: 6.7.0 - /usr/local/bin/npm
    SDKs:
      Android SDK:
        API Levels: 23, 26, 27, 28
        Build Tools: 27.0.3, 28.0.3, 29.0.0
        System Images: android-27 | Google APIs Intel x86 Atom, android-27 | Google Play Intel x86 Atom
    IDEs:
      Android Studio: 3.3 AI-182.5107.16.33.5314842
    npmPackages:
      react: ~16.8.6 => 16.8.6 
      react-native: ~0.59.10 => 0.59.10 
    npmGlobalPackages:
      react-native-cli: 2.0.1
      react-native: 0.59.10
  1. Create a react-native application running on react-native 0.59.10
  2. Create a mock api which allows HTTP and HTTPS, for example at www.mocky.io or use an own API which accepts both protocols.
  3. Make an API request using the fetch() method using both HTTP and HTTPS.

Describe what you expected to happen:
To get a valid response from my HTTPS call without TypeError: Network request failed

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions