Fetch throws 'Network request failed' on Android SDK Platform 24

[DmitryMaksakov]

Is this a bug report?

Yes

Have you read the Bugs section of the Contributing to React Native Guide?

Yes

Environment

1. react-native -v: react-native-cli: 2.0.1 react-native: 0.46.3
2. node -v: v7.7.3
3. npm -v: 4.1.2
4. yarn --version (if you use Yarn): ---

Then, specify:

• Target Platform: Android

• Development Operating System: macOS Sierra 10.12.5 (16F73)

• Build tools: Android Studio

Steps to Reproduce

fetch('https://pricesea.ru/api/auth/info', {
      credentials: 'include'
    }).then(res => {
        ...
      }).catch((e) => {
        console.log(e);
      });

Expected Behavior

Request should return HTTP code 200 and some data or HTTP code 401.

Actual Behavior

I have an error:

TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (fetch.js:441)
at XMLHttpRequest.dispatchEvent (event-target.js:172)
at XMLHttpRequest.setReadyState (XMLHttpRequest.js:546)
at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:381)
at XMLHttpRequest.js:485
at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
at MessageQueue.__callFunction (MessageQueue.js:260)
at MessageQueue.js:101
at MessageQueue.__guard (MessageQueue.js:228)
at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:100)

Reproducible Demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

I have tested different API SDK Platform versions (from 22 up to 26), the problem reproduces only on API SDK Platform 24 (Android 7.0).
I also did this request via native Android app and it was successful on all Platform versions, even 24.

[hramos]

Just curious, does this reproduce using Snack?

[DmitryMaksakov]

@hramos, this doesn't reproduces using Snack: https://snack.expo.io/rJYNZk0B- works fine.

[diegocouto]

Hi @DmitryMaksakov, I have just started to face this same issue when I updated our react-native package to 0.46.4.

What's odd is that, on development, using a Ngrok URL to our local server, everything works, but not with our production API URL.

Update

That's a bug on Android 7.0, as described here. I could get it working on Android using the first workaround proposed by Vicky Chijwani, which was:

Configure your server to use the elliptic curve prime256v1. For example, in Nginx 1.10 you do this by setting ssl_ecdh_curve prime256v1;.

[SirNeuman]

thank you @diegocouto! Changing my nginx config from ssl_ecdh_curve secp384r1 to ssl_ecdh_curve prime256v1 absolutely fixed this problem for me.

[hramos]

Appears to be a bug with Android. Closing.

[cinder92]

Same issue with iOS and android in react native version 0.48.2

[song50119]

Same issue with : "react-native": "^0.46.4"

[fsunset]

Hey @cinder92, @pvsong - have you reached a fix for it? I'm facing the very same issue after upgrading to 0.50 :/ I appreciate your replies.

[mkmuduli]

i have also same issue ,plz provide solution

[paulus6lau]

@diegocouto and @hramos , if it is android 7.0 bug, why does native request work well on Android 7.0 for same url as mentioned by @DmitryMaksakov

[paulus6lau]

and for the sample https://snack.expo.io/rJYNZk0B- shared by @DmitryMaksakov , it always shows "Network request failed"

[dben89x]

Damn. Same boat here.