Network request failed on Android device using fetch

Question

I've got error "Network request failed" when using fetch in React Native on Android emulator/real device. The code is below:

 fetch('http://localhost:3000/response', {
      method: 'POST',
      headers: {
          Accept: "aplication/json;charset=UTF-8",
          "Content-Type": "application/json"
      },
      body:JSON.stringify({name: "abc", email: "[email protected]"}),
      })
      .then((response) => response.json())
      .then((responseJson) => {

          alert('response object:' + JSON.stringify(responseJson));

          if(responseJson.valid === true){
              // do something

          }

      })
      .catch((error) => {
        console.error(error);
        alert(error);
      });

    });

I've tried to fix it by adding "app.use(cors());" on express server. This fix works when I simulate on web but still fails on emulator or real device.

did you try to make ///android:usesCleartextTraffic="true"// in android manfiest — Abd
– Abd, Commented Mar 31, 2020 at 8:48

Mike · Accepted Answer · 2020-03-31 08:53:01Z

3

You got 2 options:

Either implement https for your api endpoint as Neelam mentioned
Or add clearTextTraffic true in your AndroidManifest as Abd mentioned here is how you can do that:

<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        ...
        android:usesCleartextTraffic="true"
        ...>
        ...
    </application>
</manifest>

answered Mar 31, 2020 at 8:53

Mike

1,36312 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

An Nguyen Over a year ago

Thanks. The first option does not work, I'm using Expo for app deployment so there is not AndroidManifest file but an app.json configuration file instead

Vanns35 · Accepted Answer · 2020-03-31 10:39:42Z

2

React native is not worked when you fetch localhost url means instead of localhost you supposed to put an IP address their to make sure that devices are within a network. Just Replace localhost with your IP address. And make sure to connect your mobile with same wifi or network.

fetch('http://yourIPaddress:3000/response', {
      method: 'POST',

Ask if any query.

answered Mar 31, 2020 at 10:39

Vanns35

4644 silver badges15 bronze badges

2 Comments

An Nguyen Over a year ago

Thank. Yes, I connected my phone to the machine via USB, changing localhost to my machine IP address but nothing worked!

Vanns35 Over a year ago

Check your api call from POSTMAN.

Neelam Soni · Accepted Answer · 2020-03-31 08:48:06Z

0

use secure server links https, it should work for you

answered Mar 31, 2020 at 8:48

Neelam Soni

1,39110 silver badges17 bronze badges

1 Comment

An Nguyen Over a year ago

I've found a solution. Just need to replace 'localhost' by '10.0.2.2'' for Android emulator then it worked.

Collectives™ on Stack Overflow

Network request failed on Android device using fetch

3 Answers 3

1 Comment

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related