TypeError: Network request failed On Android

[keyz23]

Hi Everyone, I found this problem on my React-Native Android App.
When I using a fetch to communicate with a working api, this type of error is returned to me.

TypeError: Network request failed

I Used the Chrome debbuger and I found this:

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:181) at MessageQueue.__callFunction (MessageQueue.js:366) at MessageQueue.js:106 at MessageQueue.__guard (MessageQueue.js:314) at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:105)

This is the code that I used:

`static creaUtente(identity, FirstName, LastName, FiscalCode , Email) {
let formdata = new FormData();
formdata.append('Identity', identity);
formdata.append('FirstName', FirstName);
formdata.append('LastName', LastName);
formdata.append('FiscalCode', FiscalCode);
formdata.append('Email', Email);

    console.log(Configuration.base_url.rest + Configuration.apiRoutes.signUp)
    console.log(formdata)

    return new Promise((resolve, reject)=> {
        fetch('https://linktotheapi.com',{
            method: 'POST',
            headers: {
                'Content-Type': 'multipart/form-data',
            },
            body: formdata
        })
        .then((response) => response.json())
        .then((responseData) => {
            if(responseData.Error){
                Alert.alert("Errore");
            }
            global.utente = responseData;
            resolve(responseData)
        })
        .catch((err) => {reject(err)})
    })
}`

I manually tried to use the API and it works. So the problem is fetch.
I have seen and read that a lot have encountered this problem on android without a real solution.

The API link is a link type: https: //****.com (it is not a localhost).
I tried to use the http version of the API but the error still appears.

Now, This is my package.json

dependencies": { "@react-native-community/async-storage": "^1.4.2", "buffer": "^5.2.1", "pouchdb-adapter-asyncstorage": "^6.4.1", "pouchdb-authentication": "^1.1.3", "pouchdb-find": "^7.0.0", "pouchdb-react-native": "^6.4.1", "react": "16.8.3", "react-native": "0.59.4", "react-native-ble-manager": "^6.6.2", "react-native-ble-plx": "^1.0.3", "react-native-json-tree": "^1.2.0", "react-native-keyboard-aware-scroll-view": "^0.8.0", "react-native-router-flux": "^4.0.6", "react-native-tab-navigator": "^0.3.4", "react-native-vector-icons": "^6.4.2" }, "devDependencies": { "@babel/core": "7.4.3", "@babel/runtime": "7.4.3", "babel-jest": "24.7.1", "jest": "24.7.1", "metro-react-native-babel-preset": "0.53.1", "react-test-renderer": "16.8.3" }, "jest": { "preset": "react-native" } }

I have read that this problem is on Android Device ( I obviously added internet permissions in the Manifest file ). Do you know nothing about this problem??

[react-native-bot]

Thanks for submitting your issue. Can you take another look at your description and make sure the issue template has been filled in its entirety?

👉 Click here if you want to take another look at the Bug Report issue template.

[lucky-newbie]

did you solve it? i met too...

[keyz23]

No I haven't solve it...

[keyz23]

Nobody?

[Valiums]

hey @keyz23 @823844596,
I recently encountered something similar using fetch and formDatas (only on Android though).
The workaround that worked for me was to use XMLHttpRequest instead of fetch.
Hopefully this will help you too!

I don't know if you are using expo but for me this problem started when I updated my expo SDK from 31 to 33 (so RN 0.57.1 to 0.59.8)

[amohit1315]

Was anyone able to solve it??
I am facing similar issue with fetch. I have to use common code for android and iOS. fetch works great in iOS but in android throws error.

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);

   })

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

[garrinmf]

@keyz23 you closed the ticket, but did you find a fix for it?

[IcebergRage]

@keyz23 @garrinmf do you find a solution ?

[garrinmf]

@IcebergRage, I got past this, forgot I'd commented anywhere though and it's a bit fuzzy now.

I believe in my case it was failing when I only had the header for Content-Type: "multipart/form-data" as that was enough to make it work on iOS. But, on Android, I also had to specify that I wanted JSON back with the header Accept: "application/json". Simply specified both and 💥.

[ailton-moreira]

I have the same issue. Did any one was able to solve it?