React Native Fetch On Android Returns Network Request Failed

I am building a React Native mobile application that is using a Laravel backend, currently running on localhost:8000. When making a fetch request from an Android device to my serve

Solution 1:

iOS runs in a simulator while Android runs in an emulator. Emulator emulates a real device, while simulator only imitates a device. Therefore localhost on Android points to the emulated Android device instead of the machine where your server runs. You should change localhost in yours request paths with the IP address of your machine.

More details at: https://github.com/facebook/react-native/issues/10404#issuecomment-267303151

Solution 2:

I suspect that 127.0.0.1 or localhost will point to the emulator itself in your computer where the server is currently running. Try replacing 127.0.0.1 / localhost with 10.0.2.2 if you are on AVD or 10.0.3.2 if you are on Genymotion or with your computer's actual IP address. In addition, you should also make sure that your android app can use internet. You can do that by adding

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

in your AndroidManifest.xml.

Solution 3:

Founded solution for Laravel and react native (Physical device)

1. open cmd run ipconfig copy ipv4 address for example my ipv4 address is 192.168.43.235
2. Connect same network for laptop and physical device or open hotspot and connect same network
3. Now run command start laravel backend php artisan serve --host=192.168.43.235 --port=8000
4. change api url from react native api service

apiServise.js

import axios from'axios';
    
    const api_url = 'http://192.168.43.235:8000';
    
    exportconstgetCategories = request =>
  axios
    .get(api_url + '/api/categories', {
      params: request || {},
    })
    .then(response => response.data);

homescreen.js

import {getCategories} from'../services/ApiService';

asyncfetchCategories() {
    awaitgetCategories()
      .then(response => {
        this.setState({
          dataCategories: response
        });
      })
      .catch(error => {
        console.log(error);
      });
  }

1. Now run command start react native app react-native run-android

that is all...now api request working fine.

Solution 4:

Change http://localhost:8000/api/establishments/get localhost with, which can your emulator reach generally 10.0.2.2 ;) have phun.