React-native: Fetch not working on Android 9 API 28

Created on 26 Apr 2019  ·  117Comments  ·  Source: facebook/react-native

🐛 Bug Report

Hello,

I'm having an Issue about a HTTP service (the error only in simulator with API 28 (Pie) environment). I already add the domain on react_native_config.xml and add the networkSecurityConfig on both Manifests.xml (debug and release) but still get the TypeError: Network request failed error:

I already try all this Issues: #23986, #23984

My info:
info
React Native Environment Info:
System:
OS: macOS 10.14.2
CPU: (8) x64 Intel(R) Core(TM) i7-3720QM CPU @ 2.60GHz
Memory: 318.58 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 11.8.0 - /usr/local/bin/node
Yarn: 1.13.0 - /usr/local/bin/yarn
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
Android SDK:
API Levels: 25, 26, 27, 28
Build Tools: 25.0.0, 25.0.1, 26.0.2, 27.0.3, 28.0.3
System Images: android-25 | Google APIs Intel x86 Atom, android-25 | Google APIs Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.3 AI-182.5107.16.33.5199772
Xcode: 10.2/10P91b - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.0 => 0.59.0
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

My react_native_config.xml:


acolhebrasil.com.br


localhost
10.0.2.2
10.0.3.2

My fetch:
fetch(baseURLAPI + action, {
method: method,
headers: headers,
body: bodyObj ? JSON.stringify(bodyObj) : null
}).then((response) => {
console.log(response)
if(response.ok){
return response.json();
}
throw new Error(response.text());
})
.then((responseJson) => {
console.log(responseJson)
if(callbackSuccess){
return callbackSuccess(responseJson);
}
})
.catch((error) => {
console.log(error)
if(callbackError){
return callbackError(error);
}
});
My API: http://acolhebrasil.com.br/Sistema/api/login/

Console:
TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (ReactNativeRenderer-dev.js:3731)
at XMLHttpRequest.dispatchEvent (ReactNativeRenderer-dev.js:10394)
at XMLHttpRequest.setReadyState (ReactNativeRenderer-dev.js:10127)
at XMLHttpRequest.__didCompleteResponse (ReactNativeRenderer-dev.js:9895)
at ReactNativeRenderer-dev.js:10051
at RCTDeviceEventEmitter.emit (blob:http://localhost:8081/9854a9b9-407d-4571-8675-e6fadd170803:3282)
at MessageQueue.__callFunction (ReactNativeART.js:13)
at blob:http://localhost:8081/9854a9b9-407d-4571-8675-e6fadd170803:2336
at MessageQueue.__guard (ReactNativeART.js:10)
at MessageQueue.callFunctionReturnFlushedQueue (blob:http://localhost:8081/9854a9b9-407d-4571-8675-e6fadd170803:2335)

Bug Android 🌐Networking

Most helpful comment

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

All 117 comments

Same here. There is an exception called "NoSuchKeyException" when use fetch api (it's only as release).

I tried now to change fetch to axios, same error. I believe that is an Android security configuration missing ou somenthing like.

I tried now to change fetch to axios, same error. I believe that is an Android security configuration missing ou somenthing like.

It seems that the solution for now is to rollback my RN project (from last version .59.5) to .58 :/, but i'm using hooks :(

Same issue here, have you found any better solutions by any chance? I'm running RN 0.58.3 for reference

See this #24361

Same here on 0.58.6.

I have tried network_security_config.xml as described here https://github.com/facebook/react-native/issues/22375
As well as a android:usesCleartextTraffic="true" as described here https://github.com/facebook/react-native/issues/23986
Also tried axios
Still getting the same error

I use http://localhost:5000 for the local api.

On latest RN 0.59.x, all http connections should be doable in debug apps, and https should only be enforced in release apps.

If issue is related to network_security_config, using XMLHttpRequest/fetch/axios won't matter.
They will all go through RN's networking native module, which uses OkHttp that checks if Android app allows insecure connections and will be blocked there.

I don't know about NoSuchKeyException related to this, please copy paste an entire stack trace.

Also version numbers reported here by multiple people are conflicting, please clearly write
- what RN version (0.57, 0.58, 0.59) you're testing with, preferably with minor releases like 0.59.0, 0.59.1 etc.
- if you use debug vs release apks
- Android API version
to better understand what the issue is and possibly find a culprit in commit history quicker.

You need to use "https" when fetching something. Installing SSL certificate and enabling https link solved my issue. (I did try Android 9.0, axios is working, fetch is working.)

@mrkacan Many people use localhost for their api in development and many also do not have their localhost setup with https yet. I think this is a common enough use case that it should be supported.

Are you able to access the api from chrome browser? localhost on Android emulator is not the same as the host. You might need to do a adb reverse for it to work

Hi
same issue here!

for testing purposes, we are using http for fetch data to our test physical mobile devices, if react-native block this capability, in our test environments we should install more than one ssl certificate and it made complex routines for internal tests.
i completely agree for security reasons in production environment the users must use https, but the liability shift will not take by development languages it should not force the devopers to use single security option, for example, if some programming languages declined the udp connection beacuse it is not reliable for some reasons, it will not be acceptable.

it doesn't make sense to prevent using http in development level, some use cases and some business may use http, without any security becase the net work is private and ssl encapsulation will made the request/response too slow.

i think this rule must be add in devoploment and business level not in development languages level.

Regards.

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

@mohsenomidi
Thank You very much. That worked for me!

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

That worked for me too. Thanks! @mohsenomidi

I was having the same problem OP had, but using axios and having just updated my cordova android platform to the newest one.

@mohsenomidi That worked for me too :)

@mohsenomidi You save my life today, Thanks

Thanks for your help

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

is the issue solved for https??

Trying to fetch data from remote server via api.
Using fetch(https:url:port) to fetch the data. But every time android emulator as well as physical device gives network request failed. While I can access same url within browser of emulator.

I have already went through various links, and many people have posted same problem but none of them had ample solution that works. While some people were not able to access localhost via api-call but it was resolved using IP address of system. But in my scenario I am trying to access remote host. Also domain name cannot be used in my scenario, so need a solution using (ip) in fetch method=get.

testlogin = https://10.209.7.115:8080/api/v1/
Basicauth = 'Basic cm9vdDpyb290'

fetch(testingLogin, {
method: "GET",
cache: "no-cache",
mode: "cors",
withCredentials: true,
credentials: "include",
headers: {
'Authorization':Basicauth,
Accept: "application/json",
"Content-Type": "application/json"
}
}).then(response =>
{
if(response.status === 200)
{
this.props.navigation.navigate('Home');
}
else
{
alert("Authorization failed");
}
})
.catch(error => {
alert("Request Failed :Check the ip address Entered:Problem with server ");
throw(error);
})

TypeError: Network request failed
onerror@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:24051:31
dispatchEvent@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28695:31
setReadyState@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28448:33
__didCompleteResponse@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28275:29
emit@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:3280:42
__callFunction@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2577:49
http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2334:31
__guard@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2531:15
callFunctionReturnFlushedQueue@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2333:21

info
React Native Environment Info:
System:
OS: macOS 10.14.5
CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
Memory: 54.73 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.4.0 - /usr/local/bin/node
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
Android SDK:
API Levels: 25, 27, 28, 29
Build Tools: 28.0.3, 29.0.0
System Images: android-27 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5522156
Xcode: /undefined - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.3 => 0.59.3
npmGlobalPackages:
react-native-background-fetch: 2.6.0
react-native-cli: 2.0.1
react-native-gesture-handler: 1.3.0

is the issue solved for https??

Trying to fetch data from remote server via api.
Using fetch(https:url:port) to fetch the data. But every time android emulator as well as physical device gives network request failed. While I can access same url within browser of emulator.

I have already went through various links, and many people have posted same problem but none of them had ample solution that works. While some people were not able to access localhost via api-call but it was resolved using IP address of system. But in my scenario I am trying to access remote host. Also domain name cannot be used in my scenario, so need a solution using (ip) in fetch method=get.

testlogin = https://10.209.7.115:8080/api/v1/
Basicauth = 'Basic cm9vdDpyb290'

fetch(testingLogin, {
method: "GET",
cache: "no-cache",
mode: "cors",
withCredentials: true,
credentials: "include",
headers: {
'Authorization':Basicauth,
Accept: "application/json",
"Content-Type": "application/json"
}
}).then(response =>
{
if(response.status === 200)
{
this.props.navigation.navigate('Home');
}
else
{
alert("Authorization failed");
}
})
.catch(error => {
alert("Request Failed :Check the ip address Entered:Problem with server ");
throw(error);
})

TypeError: Network request failed
onerror@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:24051:31
dispatchEvent@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28695:31
setReadyState@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28448:33
__didCompleteResponse@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28275:29
emit@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:3280:42
__callFunction@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2577:49
http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2334:31
__guard@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2531:15
callFunctionReturnFlushedQueue@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2333:21

info
React Native Environment Info:
System:
OS: macOS 10.14.5
CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
Memory: 54.73 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.4.0 - /usr/local/bin/node
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
Android SDK:
API Levels: 25, 27, 28, 29
Build Tools: 28.0.3, 29.0.0
System Images: android-27 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5522156
Xcode: /undefined - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.3 => 0.59.3
npmGlobalPackages:
react-native-background-fetch: 2.6.0
react-native-cli: 2.0.1
react-native-gesture-handler: 1.3.0

@amohit1315 your issue is not related to this case you are using HTTPS and have an issue, please open another case to report your problem, the workaround solution for http fetch only has been provided in my last comment.

React-Native Version: 0.59.0
Axios: 0.18.0
Not working for me! :(

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Seeing the same issue using HTTPS connections via Axios and Fetch, running on Android Pie API 28.

Adding android:usesCleartextTraffic="true" to manifests does not resolve this issue.

package.json dependencies:
"dependencies": { "axios": "^0.19.0", "react": "16.8.3", "react-native": "0.59.9" }

Axios and Fetch examples:
````
axios.get("https://HTTPS_BASED_API_GOES_HERE").then((response) => response.json())
.then((responseJson) => {

console.log(responseJson);

})
.catch((error) => {
console.error("Axios error", error);
});

fetch("https://HTTPS_BASED_API_GOES_HERE")
.then(response => {

console.log(response);

this.setState({
    isLoading: false,
    recentArticles: response.recentArticles,
    tags: response.tags
}, function () {

});

})
.catch((error) => {
console.error("Fetch error", error);
});
````

Hi Everyone,

whoever is facing this problem.
I found a get around. Hopefully someone will fix it in fetch.

Stop using fetch.

Install "'react-native-fetch-blob'"

import it in your js file as

import RNFetchBlob from 'react-native-fetch-blob';

Replace your original fetch as below code

RNFetchBlob.config({
            trusty : true // <---add this
        })
        .fetch('GET', ip1, {
        Authorization : token,
      })
      .then((response) => response.json())
    .then((responseData) => {
        console.log("responseData : " +responseData);
        return responseData
    }).catch((error) => {
        console.log("error : " +error);
        throw(error);
        return {};
    });

trust: true avoids checking for certificates.

Good luck. Comment if you found it useful or not.
All my problems are solved now and working great for both iOS and android.

trust: true avoids checking for certificates.

This is unfortunately quite a dangerous workaround that I would not recommend. Your app should always be checking to ensure certificate are valid and not foraged.

True I agree....

one should always configure certificates.... My scenario was tricky because my app required fetch info from remote host...there could be a thousand or many more and each will have separate certificate

One should use this approach in desperate need only 😊

@mohsenomidi That worked for me too. Thanks!

React-Native Version: 0.59.0
Axios: 0.18.0
Not working for me! :(

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

me too.not working.

React-Native Version: 0.59.0
Axios: 0.18.0
Not working for me! :(

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

me too.not working.

Make sure u still use http:// not https:// to fetch . it can working on Android 9 with API 28

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Thanks! You saved my life

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Thank you very much. It was solved my problem... Everything is working.

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Im doing this with appollo client (graphql). but it's not working for me.. :( anyone here tried with graphql?

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Gracias desde Acapulco, mexico

@mohsenomidi
Thanks a lot. It worked for me.
"react-native": "0.60.4"

you can use ngrok for this problem

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Worked for me too. 💯

I believe the solution mentioned above breaks the security added by google in Android 9, should we not limit this to localhost connections to debug mode. We could fix this by first adding an new xml config:

... src/main/res/xml/network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
    </domain-config>
</network-security-config>

and then reference it in the Android Manifest

<manifest xmlns:tools="http://schemas.android.com/tools"> 
.... 
<application ... android:networkSecurityConfig="@xml/network_security_config"> 
... 
</application> 
</manifest>

hello ,
i am facing problem in fetching json of product through woo commerce in react native.

can i see where i paste that code in android manifest ? anybody can show me your androidmanifest ?

Hi @andikare,

I have also faced same Problem. I have used @mohsenomidi answer. you need to apply like this,

<application android:usesCleartextTraffic="true" ......></android>

In android manifest file append android:usesCleartextTraffic="true" this word in line.

image

I hope you understand.

Thank you so much @Muthukumar1996 , it's works ^_^

I have the same problem. Any one found solution for https request with self signed certificate?

I still have the problem with fetching https given that the endpoints are lambda function behind APIGateway

I am having this problem with both HTTP and HTTPS. Adding android:usesCleartextTraffic="true" to my manifest did not work.

I am having this problem with both HTTP and HTTPS. Adding android:usesCleartextTraffic="true" to my manifest did not work.

Do you have this configuration in your manifest too?

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application>

Do you have this configuration in your manifest too?

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application>

Yes

Do you have this configuration in your manifest too?
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application>

Yes

Can you show us the error? maybe we can help you...

You need to use "https" when fetching something. Installing SSL certificate and enabling https link solved my issue. (I did try Android 9.0, axios is working, fetch is working.)

Thanks! This finally worked!

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

This worked for me. Thank YOU

You need to use "https" when fetching something. Installing SSL certificate and enabling https link solved my issue. (I did try Android 9.0, axios is working, fetch is working.)

how to use fetch for "http" ? without SSL
iam facing the same issue app is not working on mobile , working on emulator .

You need to use "https" when fetching something. Installing SSL certificate and enabling https link solved my issue. (I did try Android 9.0, axios is working, fetch is working.)
@izhan25
how to use fetch for "http" ? without SSL
iam facing the same issue app is not working on mobile , working on emulator .

Hi @andikare,

I have also faced same Problem. I have used @mohsenomidi answer. you need to apply like this,

<application android:usesCleartextTraffic="true" ......></android>

In android manifest file append android:usesCleartextTraffic="true" this word in line.

image

I hope you understand.

@Muthukumar1996

my xml file is some what different could u please tell where should i change the code please.

package="com.redx">

<uses-permission android:name="android.permission.INTERNET" />

<application
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

I wound up creating a new project from scratch and copying my JS over. That solved all connection issues for me.

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Thank you very much. It was solved my problem. <3

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Thank you! Solved my problems 👍🏻.

i use
"react-native": "0.60.4"
"react-native-axios": "^0.17.1"

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

.... ...

Thanks you! it works

I have same problem

in my case everything resolve when I access my emulalator to network.
my android emulator didnt't access to network.

I resolve from below.

https://stackoverflow.com/questions/42736038/android-emulator-not-able-to-access-the-internet

this works for me

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <application android:usesCleartextTraffic="true" tools:targetApi="28" />

this works for me

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <application android:usesCleartextTraffic="true" tools:targetApi="28" />

What does tools:targetApi="28" do? I want to avoid fixing this only for one API version. None of the solutions here fixed the problem for me. Still unable to build a functioning release build here

Edit: The issue was actually with another package (react-native-config) we are using.

React-Native Version: 0.59.0
Axios: 0.18.0
Not working for me! :(

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

Try like that:

xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.react.app.linguajoy">

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.RECORD_AUDIO" />

<application
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme"
  android:usesCleartextTraffic="true" 
  tools:targetApi="28">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

Using https for APIs using self signed certificate but still getting a Network request failed error.

React-Native Version: 0.59.0
Axios: 0.18.0
Not working for me! :(

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

If you are using emulator then check whether internet is working or not in this emulation using browser. If not check this: https://stackoverflow.com/questions/42736038/android-emulator-not-able-to-access-the-internet

I have also face this problem in emulator but when I generate a release app and install in a real device(andoid 9) then it works fine.

Tried the usesCleartextTraffic="true" work around but it didn't work. Then I used firebase cloud functions for rest api which has https. But it still doesn't work.

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

THIS WORKED FOR ME IN REACT NATIVE V.0.61.2, THANK YOU SO MUCH!

in my react native v.0.61.2 can't work, can you help me?
this is my code :
package="com.gpdiapp">

<uses-permission android:name="android.permission.INTERNET" />

<application
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme"
  android:usesCleartextTraffic="true" 
  tools:targetApi="28">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

in my react native v.0.61.2 can't work, can you help me?
this is my code :

<uses-permission android:name="android.permission.INTERNET" />

<application
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme"
  android:usesCleartextTraffic="true" 
  tools:targetApi="28">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

Try to put this permission in your AndroidManifest:

Then, put this line just on the top of application label:

android:usesCleartextTraffic="true"

The result in my case is:

// ---> put this permission


// ---> put this permission

<application
  android:usesCleartextTraffic="true" // ---> put this line here
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme">

Sorry, my answer is:

Try to put this permission in your AndroidManifest:

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

Then, put this line just on the top of application label:

android:usesCleartextTraffic="true"

This is part of my AndroidManifest:

<uses-permission android:name="android.permission.INTERNET" /> ---> HERE
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> ---> HERE
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

<application
  android:usesCleartextTraffic="true" ---> HERE
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme">
  <activity

Tried all the posted solutions, this is my manifest:

xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.liberetmobile">

<application
  android:usesCleartextTraffic="true"
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme"
  tools:targetApi="28">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustPan">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

Tried the https adding the ssl, I'm using 0.59.5

It is not fetching nor on the emulator or on the physical device.

Will send you a PIZZA If you can help me with this issue!

Tried all the posted solutions, this is my manifest:

<application
  android:usesCleartextTraffic="true"
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme"
  tools:targetApi="28">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustPan">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

Tried the https adding the ssl, I'm using 0.59.5

It is not fetching nor on the emulator or on the physical device.

Will send you a PIZZA If you can help me with this issue!

If you are using emulator then check whether internet is working or not in this emulation(virtual device) using browser. If not check this: https://stackoverflow.com/questions/42736038/android-emulator-not-able-to-access-the-internet

I have also face this problem in emulator but when I generate a release app and install in a real device then it works fine.

Or you can check with another virtual device. I think it will help you. :)

Yah, try to run in with a physical device, that must be work.

adding this in manifest worked.

android:usesCleartextTraffic="true"

also in some cases you may need to set android:targetSandboxVersion to 1; current default value is 2 which set useClearTextTraffic=false by default.

I m facing the same issue in version react-native v.0.61.4 can't work, can anyone please help me out?
Here is my code:
package="com.reactnativecalendar">

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_CALENDAR" />
<uses-permission android:name="android.permission.WRITE_CALENDAR" />


<application
  android:usesCleartextTraffic="true"
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

I m facing the same issue in version react-native v.0.61.4 can't work, can anyone please help me out?
Here is my code:

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_CALENDAR" />
<uses-permission android:name="android.permission.WRITE_CALENDAR" />


<application
  android:usesCleartextTraffic="true"
  android:name=".MainApplication"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:roundIcon="@mipmap/ic_launcher_round"
  android:allowBackup="false"
  android:theme="@style/AppTheme">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

Firstly do you use the IP Address instead of localhost?
Secondly, Please check your API develop environment, what is it?

I replaced ‘10.0.2.2’ with localhost and enabled remote debug to be able to
fix this issue temporarily.
When you enable emote debug your js runs in remote chrome not on emulator
so I can use localhost without a problem

On Tue, Nov 12, 2019 at 8:05 AM Nguyen Dai notifications@github.com wrote:

I m facing the same issue in version react-native v.0.61.4 can't work, can
anyone please help me out?
Here is my code:




android:usesCleartextTraffic="true"
android:name=".MainApplication"
android:label="@string/app_name"
android:icon="@mipmap/ic_launcher"
android:roundIcon="@mipmap/ic_launcher_round"
android:allowBackup="false"
android:theme="@style/AppTheme">
android:name=".MainActivity"
android:label="@string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:windowSoftInputMode="adjustResize">






Please check your API develop environment, what is it?


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/24627?email_source=notifications&email_token=AA3T37O4XGHBFSKFVB3OYTTQTJBTDA5CNFSM4HIW2UQKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEDZEINY#issuecomment-552748087,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AA3T37N2TWZK7TOH6R7PPLDQTJBTDANCNFSM4HIW2UQA
.

>


MB ChB, M.D, M.B.A
iSchool Egypt
Elegant Health Information Systems
Medical Research Institute, University of Alexandria
Cellular: +2012-7772-5552
Email : [email protected]
website . : http://simpleinformatics.com/
Facebook : http://www.facebook.com/ALZalabany
zalabany@mit.edu
stackoverflow: https://stackoverflow.com/users/741156/zalaboza
Github : https://github.com/alzalabany
Gitlab : https://gitlab.com/alzalabany

Issue has been resolved thanks for your reply.

On Tue, 12 Nov 2019, 12:44 pm Momen Zalabany, notifications@github.com
wrote:

I replaced ‘10.0.2.2’ with localhost and enabled remote debug to be able to
fix this issue temporarily.
When you enable emote debug your js runs in remote chrome not on emulator
so I can use localhost without a problem

On Tue, Nov 12, 2019 at 8:05 AM Nguyen Dai notifications@github.com
wrote:

I m facing the same issue in version react-native v.0.61.4 can't work,
can
anyone please help me out?
Here is my code:


/>

android:usesCleartextTraffic="true"
android:name=".MainApplication"
android:label="@string/app_name"
android:icon="@mipmap/ic_launcher"
android:roundIcon="@mipmap/ic_launcher_round"
android:allowBackup="false"
android:theme="@style/AppTheme">
android:name=".MainActivity"
android:label="@string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:windowSoftInputMode="adjustResize">





android:name="com.facebook.react.devsupport.DevSettingsActivity" />

Please check your API develop environment, what is it?


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
<
https://github.com/facebook/react-native/issues/24627?email_source=notifications&email_token=AA3T37O4XGHBFSKFVB3OYTTQTJBTDA5CNFSM4HIW2UQKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEDZEINY#issuecomment-552748087
,
or unsubscribe
<
https://github.com/notifications/unsubscribe-auth/AA3T37N2TWZK7TOH6R7PPLDQTJBTDANCNFSM4HIW2UQA

.

>


MB ChB, M.D, M.B.A
iSchool Egypt
Elegant Health Information Systems
Medical Research Institute, University of Alexandria
Cellular: +2012-7772-5552
Email : [email protected]
website . : http://simpleinformatics.com/
Facebook : http://www.facebook.com/ALZalabany
zalabany@mit.edu
stackoverflow: https://stackoverflow.com/users/741156/zalaboza
Github : https://github.com/alzalabany
Gitlab : https://gitlab.com/alzalabany


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/24627?email_source=notifications&email_token=AKACLMGM3MB2SYLWUQ3CQK3QTJJW3A5CNFSM4HIW2UQKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEDZIMRQ#issuecomment-552764998,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AKACLMEZBFTNRNXC5QHL7XDQTJJW3ANCNFSM4HIW2UQA
.

i still have the issue i tried everything mentioned above.
1) Issue : Api works fine in ios but throws error "SyntaxError: Json parse error: unexpected identifier "Unauthorized" " in android
2) its a "https" api

below is my code in android/app/src/main/AndroidManifest.xml
xmlns:tools="http://schemas.android.com/tools">

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

<application android:usesCleartextTraffic="true" tools:targetApi="28" ></application>

Hi, sagarrs
Did you add the authentication token into the header of http request?

Hi, sagarrs
Did you add the authentication token into the header of http request?

hi @MobileDevStar as i have mentioned its a "https" request and there is no need for auth token for the api. It works perfectly fine in IOS . is there any solution for this ?

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

You have helped me with your answer, although I put this (android:usesCleartextTraffic="true" tools:targetApi="28") and I got an error, put this (android:usesCleartextTraffic="true") and it worked perfect .. thank you very much

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

@mohsenomidi solution worked like a charm 4 me.

10x a lot!

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

You have helped me with your answer, although I put this (android:usesCleartextTraffic="true" tools:targetApi="28") and I got an error, put this (android:usesCleartextTraffic="true") and it worked perfect .. thank you very much

Same here!

My shopify public api (https://{apikey}:{password}:@{shop-domain}//admin/customers) working perfectly on ios and postman but not on android. It gives 401 error : "Invalid API key or access token (unrecognized login or wrong password)" on android phone. Any help would be greatly appreciated!

My shopify public api (https://{apikey}:{password}:@{shop-domain}//admin/customers)

@deepas96 :
I think this is not a right place to ask your question, your question is not completely related to this thread topic, please ask your question in related shopify community or it’s git page or the related place !

Thanks

try to add android:networkSecurityConfig="@xml/network_security_config" in AndroidManifest.xml

<application
...
android:networkSecurityConfig="@xml/network_security_config" >

and create folder and file on android/app/src/main/res/xml/network_security_config.xml and put this code

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
<base-config cleartextTrafficPermitted="true">
<trust-anchors>
 <certificates src="system" />
</trust-anchors>
</base-config>
</network-security-config>

hope it work :D

this works for me

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <application android:usesCleartextTraffic="true" tools:targetApi="28" />

This helped me work. My project based on v. 0.61.5. Thanks.

this works for me

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <application android:usesCleartextTraffic="true" tools:targetApi="28" />

This helped me work. My project based on v. 0.61.5. Thanks.

I just do everything on 0.61.5 and still not working | android 10


Fixed, i just made this / network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">192.168.1.104</domain>
        <domain includeSubdomains="true">google.com</domain>
    </domain-config>
</network-security-config>

AndroidManifest.xml : android:networkSecurityConfig="@xml/network_security_config"

https://stackoverflow.com/questions/42736038/android-emulator-not-able-to-access-the-internet

OMG I cannot belive this was the issue! Working till 3AM and couldnt find the issue. Now i feel a little stupid not to check that. Thank you @Robiullah2244

For us we are using v0.61.5 and fetch only works on iOS. I've tried all fixes mentioned above and none works. Eventually switched to axios and I am able to make request happily again. Hopefully this gets fixed soon!

hi, by using network_security_config.xml it solved in API 28 / Android 9 but same code stop working
in API 29/Android 10. all my clients have update android 10 unable to connect.
application just crash without any exception on
httpTransport.call(SOAP_ACTION, envelope);

I have done, as i was using

ksoap2-android-2.5.2.jar

in my application, i just replace it with

ksoap2-android-assembly-3.6.4-jar-with-dependencies.jar

It is working now

https://stackoverflow.com/questions/42736038/android-emulator-not-able-to-access-the-internet

OMG I cannot belive this was the issue! Working till 3AM and couldnt find the issue. Now i feel a little stupid not to check that. Thank you @Robiullah2244

I got the same issue, just try open browser then open any link and the emulator seem cannot connect to the network. After wipe data + cold boot everything now smooth. Cheer!

For those who tried everything and still get this error:

import { Platform } from 'react-native';

const config = {
  server: Platform.select({
    ios: '127.0.0.1', // or 'localhost'
    android: '10.0.2.2',
  }),
};

config.apiEndpoint = `http://${config.server}:port/api`;

Explanation: iOS Simulators use the same environment as our programming environment (your computer), while Android emulators set up a new device with a different IP address, so their localhost doesn't match ours.

Source: https://stackoverflow.com/questions/5528850/how-do-you-connect-localhost-in-the-android-emulator

Same here on 0.58.6.

I have tried network_security_config.xml as described here #22375
As well as a android:usesCleartextTraffic="true" as described here #23986
Also tried axios
Still getting the same error

I use http://localhost:5000 for the local api.

This suggest works for me in a legacy project using Cordova

I have an issue where fetch only work with GET requests on android, but it does not work with POST or PUT requests. All requests work on iOS.

The error i get it is:

TypeError: Network request failed at XMLHttpRequest.xhr.onerror (fetch.umd.js:473) at XMLHttpRequest.dispatchEvent (event-target-shim.js:818) at XMLHttpRequest.setReadyState (XMLHttpRequest.js:574) at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:388) at XMLHttpRequest.js:501 at RCTDeviceEventEmitter.emit (EventEmitter.js:189) at MessageQueue.__callFunction (MessageQueue.js:436) at MessageQueue.js:111 at MessageQueue.__guard (MessageQueue.js:384) at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:110)

I'm using react native 0.61.5 and the endpoint I'm hitting is an https url that I created on another server

I've tried android:usesCleartextTraffic="true"
I've tried using axios and I get the same error
I've also tried testing on both physical devices and emulators

This error is very frustrating and I'm not sure what else to do...

Any help would be appreciated! :)

@jrammmy did you find any solution?

hi, yes when i use ksoap's latest version, it solved my problem Sent from my Samsung Galaxy smartphone.
-------- Original message --------From: "alem.khodadadi" notifications@github.com Date: 27/05/2020 13:26 (GMT+05:00) To: facebook/react-native react-native@noreply.github.com Cc: Muhammad Aamir Javed blackprinceaj@gmail.com, Comment comment@noreply.github.com Subject: Re: [facebook/react-native] Fetch not working on Android 9 API 28 (#24627)
@jrammmy did you find any solution?

—You are receiving this because you commented.Reply to this email directly, view it on GitHub, or unsubscribe.
[
{
"@context": "http://schema.org",
"@type": "EmailMessage",
"potentialAction": {
"@type": "ViewAction",
"target": "https://github.com/facebook/react-native/issues/24627#issuecomment-634509760",
"url": "https://github.com/facebook/react-native/issues/24627#issuecomment-634509760",
"name": "View Issue"
},
"description": "View this Issue on GitHub",
"publisher": {
"@type": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
}
]

Hi All,

I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml

<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

This worked fine for Regular Androids.
What about MIUI on Xiaomi phones? It still doesn't work. Does anybody know how to fix this Xiaomi devices as well?

hi, yes this work till api 28 for http, but it also not worked if using api 29/android 10. my problem was android 10 and as i update koasp lib now its fine for meSent from my Samsung Galaxy smartphone.
-------- Original message --------From: Fernando Cerveira notifications@github.com Date: 02/06/2020 04:40 (GMT+05:00) To: facebook/react-native react-native@noreply.github.com Cc: Muhammad Aamir Javed blackprinceaj@gmail.com, Comment comment@noreply.github.com Subject: Re: [facebook/react-native] Fetch not working on Android 9 API 28 (#24627)

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
.... ...

This worked fine for Regular Androids.
What about MIUI on Xiaomi phones? It still doesn't work. Does anybody know how to fix this Xiaomi devices as well?

—You are receiving this because you commented.Reply to this email directly, view it on GitHub, or unsubscribe.
[
{
"@context": "http://schema.org",
"@type": "EmailMessage",
"potentialAction": {
"@type": "ViewAction",
"target": "https://github.com/facebook/react-native/issues/24627#issuecomment-637182629",
"url": "https://github.com/facebook/react-native/issues/24627#issuecomment-637182629",
"name": "View Issue"
},
"description": "View this Issue on GitHub",
"publisher": {
"@type": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
}
]

what error shows in debug?

On Fri, 8 May 2020 at 00:40, Gerson Montenegro notifications@github.com
wrote:

Same here on 0.58.6.

I have tried network_security_config.xml as described here #22375
https://github.com/facebook/react-native/issues/22375
As well as a android:usesCleartextTraffic="true" as described here #23986
https://github.com/facebook/react-native/issues/23986
Also tried axios
Still getting the same error

I use http://localhost:5000 for the local api.

This suggest works for me in a legacy project using Cordova


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/24627#issuecomment-625457109,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AOUAUXWCNN2YUVICVTXL3V3RQMFDDANCNFSM4HIW2UQA
.

Hi All,
I found a work around solution for Http (non HTTPS) fetch :
Add the codes in your main AndroidManifest.xml
<manifest xmlns:tools="http://schemas.android.com/tools"> .... <application android:usesCleartextTraffic="true" tools:targetApi="28"> ... </application> </manifest>

This worked fine for Regular Androids.
What about MIUI on Xiaomi phones? It still doesn't work. Does anybody know how to fix this Xiaomi devices as well?

yes bro same issue but i have run the usb connected to run ... but i generate
apk api fetch not working .....

Guys any solution? This cleartexttraffic flag isnt working for me.

You need to use "https" when fetching something. Installing SSL certificate and enabling https link solved my issue. (I did try Android 9.0, axios is working, fetch is working.)

So i have problem my apps couldnt login, but this issue only in Android 9 above. I dont realize the problem is because https.

After a lot of things i've tried, and nothing is working. This simple suggestion saving my life ! Thankyou. You are a Hero !
Lucky me i tried it. Haha! Come to Indonesia and i will buy you a beer ! Cheers.

For those who tried everything and still get this error:

import { Platform } from 'react-native';

const config = {
  server: Platform.select({
    ios: '127.0.0.1', // or 'localhost'
    android: '10.0.2.2',
  }),
};

config.apiEndpoint = `http://${config.server}:port/api`;

Explanation: iOS Simulators use the same environment as our programming environment (your computer), while Android emulators set up a new device with a different IP address, so their localhost doesn't match ours.

Source: https://stackoverflow.com/questions/5528850/how-do-you-connect-localhost-in-the-android-emulator

Thanks so much, this works great!!

Still getting the same error :(
React Native: 0.63.0
Android: 10.0 (Q)
Android SDK Platform: 29
Android SDK Build-Tool: 29.0.3
Emulator can connect to Network, cleartextTrafficPermitted is set to true
Error looks like: HTTP Failure in Axios [Error: Network Error]

Still getting the same error :(
React Native: 0.63.0
Android: 10.0 (Q)
Android SDK Platform: 29
Android SDK Build-Tool: 29.0.3
Emulator can connect to Network, cleartextTrafficPermitted is set to true
Error looks like: HTTP Failure in Axios [Error: Network Error]

Same here, did you find any solution?

Using "https" works for me !
Cheers 🍻🍻

@bona-ws I use https but it still doesn't work. it works on Android 10 and not 9 or lower versions.

Add the code android manifest 💯 worked me.... Try it...

android:usesCleartextTraffic="true"

On Sun 6 Sep, 2020, 7:16 PM Lanre Adedara, notifications@github.com wrote:

@bona-ws https://github.com/bona-ws I use https but it still doesn't
work


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/24627#issuecomment-687793740,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AJJEGMY4EJH4GIVDTM4ODK3SEOHDPANCNFSM4HIW2UQA
.

@HIPHOPSANDY tried that already, didn't work.

Add the code then clean Android gradlew then restart your code editor and
restart your pc or computer.....

On Sun 6 Sep, 2020, 8:35 PM Lanre Adedara, notifications@github.com wrote:

@HIPHOPSANDY https://github.com/HIPHOPSANDY tried that already, didn't
work.


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

Same thing @HIPHOPSANDY

Check the image try to implement your code ...

On Sun 6 Sep, 2020, 9:02 PM Lanre Adedara, notifications@github.com wrote:

Same thing @HIPHOPSANDY https://github.com/HIPHOPSANDY


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

I'm not sure I understand that @HIPHOPSANDY

I'm not sure I understand that @HIPHOPSANDY

Try to adding this permission at the top of the AndroidManifest.xml

are you solved?

yes dear, https instead of httpwork for meSent from my Samsung Galaxy smartphone.
-------- Original message --------From: HIPHOPSANDY notifications@github.com Date: 07/09/2020 12:29 (GMT+05:00) To: facebook/react-native react-native@noreply.github.com Cc: Muhammad Aamir Javed blackprinceaj@gmail.com, Comment comment@noreply.github.com Subject: Re: [facebook/react-native] Fetch not working on Android 9 API 28 (#24627)
are you solved?

—You are receiving this because you commented.Reply to this email directly, view it on GitHub, or unsubscribe.

This is my development environment.

$ react-native -v
react-native-cli: 2.0.1
react-native: 0.63.2

$ react-native info
info Fetching system and libraries information...
System:
    OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
    CPU: (4) x64 Intel(R) Core(TM) i7-6500U CPU @ 2.50GHz
    Memory: 2.12 GB / 7.64 GB
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 12.18.1 - ~/.local/node/bin/node
    Yarn: 1.22.5 - ~/.local/node/bin/yarn
    npm: 6.14.8 - ~/.local/node/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
  Languages:
    Java: 14.0.2 - /usr/bin/javac
    Python: 3.7.6 - /home/philos/.local/conda/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.13.1 => 16.13.1 
    react-native: 0.63.2 => 0.63.2 
  npmGlobalPackages:
    *react-native*: Not Found

I solved this problem as follows.

1) Add this one line to your android/app/src/debug/AndroidManifest.xml file.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

    <!-- An addition starts -->
    <uses-permission android:name="android.permission.INTERNET" />
    <!-- An addition ends-->

    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
</manifest>

2) Run the following adb commands before you run yarn react-native run-android,
if you use the JavaScript function fetch('http://127.0.0.1:3000/users') in your source code.

# for metro bundler
$ adb reverse tcp:8081 tcp:8081

# for your localhost web server port
$ adb reverse tcp:3000 tcp:3000

$ yarn react-native run-android

That's it! I hope this will help you out.

This is my development environment.

$ react-native -v
react-native-cli: 2.0.1
react-native: 0.63.2

$ react-native info
info Fetching system and libraries information...
System:
    OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
    CPU: (4) x64 Intel(R) Core(TM) i7-6500U CPU @ 2.50GHz
    Memory: 2.12 GB / 7.64 GB
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 12.18.1 - ~/.local/node/bin/node
    Yarn: 1.22.5 - ~/.local/node/bin/yarn
    npm: 6.14.8 - ~/.local/node/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
  Languages:
    Java: 14.0.2 - /usr/bin/javac
    Python: 3.7.6 - /home/philos/.local/conda/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.13.1 => 16.13.1 
    react-native: 0.63.2 => 0.63.2 
  npmGlobalPackages:
    *react-native*: Not Found

I solved this problem as follows.

  1. Add this one line to your android/app/src/debug/AndroidManifest.xml file.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

    <!-- An addition starts -->
    <uses-permission android:name="android.permission.INTERNET" />
    <!-- An addition ends-->

    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
</manifest>
  1. Run the following adb commands before you run yarn react-native run-android,
    if you use the JavaScript function fetch('http://127.0.0.1:3000/users') in your source code.
# for metro bundler
$ adb reverse tcp:8081 tcp:8081

# for your localhost web server port
$ adb reverse tcp:3000 tcp:3000

$ yarn react-native run-android

That's it! I hope this will help you out.

Thanks. It worked for me. It was missing to disable the warning.

Was this page helpful?
0 / 5 - 0 ratings