title: Network request failed on iOS device || React-Native || expo
body: <h3>What I would like to do :</h3>
  
  <p>I'm try to send a request to my API (created with ApiPlatform) in local in my React Native app with my ios device on expo.
  Could someone knows how to fix it ? :)  </p>
  
  <p>Here the request that I want to do : 
  "<a href="http://127.0.0.1:8000/api/beers" rel="nofollow noreferrer">http://127.0.0.1:8000/api/beers</a>"</p>
  
  <h3>What works :</h3>
  
  <p>My request works on my computer</p>
  
  <p>My request works on my android emulator by typing that :
  "<a href="http://10.0.2.2:8000/api/beers" rel="nofollow noreferrer">http://10.0.2.2:8000/api/beers</a>"</p>
  
  <h3>What I've done :</h3>
  
  <p>For the ios Device on expo,
  I've read that I need to change 127.0.0.1:8000 by the Ipv4 of my computer,
  so I ran </p>
  
  <pre><code>ipconfig
  </code></pre>
  
  <p>in a powershell, and get my Ipv4 address, put in my request :
  "<a href="http://172.20.10.2:8000/api/beers" rel="nofollow noreferrer">http://172.20.10.2:8000/api/beers</a>"</p>
  
  <p>I've read that ios doesn't allow http protocole, so I add in my app.json  -> infoPlist -> NSAppTransportSecurity -> true </p>
  
  <pre><code>    "ios": {
        "supportsTablet": true,
        "infoPlist": {
          "NSAppTransportSecurity" : {
            "NSAllowsArbitraryLoads" : true,
          }
        }
      }
  </code></pre>
  
  <p>. Like all the other topic said, but always the same error : "Network request failed"</p>
  
  <p>I'm connected in the same network in both(iOS device and android emulator).</p>
  
  <p>I've tried "<a href="https://anapioficeandfire.com/api/characters/583" rel="nofollow noreferrer">https://anapioficeandfire.com/api/characters/583</a>" for example, and it works on my emulator and my iOS device.</p>
  
  <p>I'm using other API but there are started by 'https'. Here the problem seem to be the 'http'.</p>
  
  <p>However I tried to fixed it by add "NSAppTransportSecurity" : "true" in the infoPlist in the app.json, but nothing change. Like I say upper.</p>
  
  <p>I've also try to connected to internet in an other home, change the IPv4. But still the issue.</p>
  
  <p>I don't see other way to fix it. I probably miss something.</p>
  
  <p>Here the function that permit the request</p>
  
  <pre><code>export function getsBeersFromRatio(){
      const url = Platform.OS === 'android'? 'http://10.0.2.2:8000/api/beers?abv%5Bgte%5D=6.2' : 'http://172.20.10.2:8000/api/beers'
      return fetch(url)
          .then((response) =&gt; response.json())
          .catch((error) =&gt; console.log(error));
  }
  
  
    _searchBeersFromRatio(){
      this.setState({
        beers: [],
      },
      () =&gt; {
        this._loadBeersFromRatio()
      })
    }
  
  
  
    _loadBeersFromRatio(){
      console.log('====================================');
      console.log('       NEW REQUEST                   ');
      console.log('====================================');
      this.setState({ isLoading: true })
      getsBeersFromRatio().then(data =&gt; {
        console.log(data);
  
      })
    }
  
  
      &lt;Button
        title = "get data from API"
        onPress = {() =&gt; this._searchBeersFromRatio()}
      /&gt;
  </code></pre>
  
  <p>Here my package.json : </p>
  
  <pre><code>{
    "main": "node_modules/expo/AppEntry.js",
    "scripts": {
      "start": "expo start",
      "android": "expo start --android",
      "ios": "expo start --ios",
      "web": "expo start --web",
      "eject": "expo eject",
      "postinstall": "node ./scripts/stfu.js"
    },
    "dependencies": {
      "country-list": "^2.1.1",
      "expo": "^33.0.0",
      "react": "16.8.3",
      "react-dom": "^16.8.6",
      "react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
      "react-native-chart-kit": "^2.6.1",
      "react-native-elements": "^1.1.0",
      "react-native-flags": "^1.0.0",
      "react-native-redash": "^6.3.1",
      "react-native-view-more-text": "^2.1.0",
      "react-native-web": "^0.11.4",
      "react-navigation": "^3.11.0",
      "react-redux": "^7.1.0",
      "redux": "^4.0.1",
      "rn-vertical-slider": "^1.0.4",
      "victory-native": "^32.0.2"
    },
    "devDependencies": {
      "babel-preset-expo": "^5.1.1"
    },
    "private": true
  }
  
  </code></pre>
  
  <p>Here my app.json</p>
  
  <pre><code>{
    "expo": {
      "name": "BierRatio",
      "slug": "BierRatio",
      "privacy": "public",
      "sdkVersion": "33.0.0",
      "platforms": [
        "ios",
        "android",
        "web"
      ],
      "version": "1.0.0",
      "orientation": "portrait",
      "icon": "./assets/icon.png",
      "splash": {
        "image": "./assets/splash.png",
        "resizeMode": "contain",
        "backgroundColor": "#ffffff"
      },
      "updates": {
        "fallbackToCacheTimeout": 0
      },
      "assetBundlePatterns": [
        "**/*"
      ],
      "ios": {
        "supportsTablet": true,
        "infoPlist": {
          "NSAppTransportSecurity" : {
            "NSAllowsArbitraryLoads" : true,
          }
        }
      }
    }
  }
  </code></pre>
  
  <h3>Expected behavior</h3>
  
  <p>I expect the same log that my android emulator</p>
  
  <h3>Actual behavior</h3>
  
  <p>The actual output is "Network request failed"</p>
  
  <p>Thank !</p>