iOS 设备上的网络请求失败 ||反应本机 ||博览会

Question

我想做什么：

我尝试在我的 React Native 应用程序中使用我的 ios 设备在本地向我的 API（使用 ApiPlatform 创建）发送请求。有人知道如何解决吗？ :)

这里是我想要做的请求： “http://127.0.0.1:8000/api/beers”

什么有效：

我的请求在我的电脑上有效

我的请求可以在我的 android 模拟器上运行，方法是输入： “http://10.0.2.2:8000/api/beers”

我做了什么：

对于展会上的 ios 设备，我读到我需要通过计算机的 Ipv4 更改 127.0.0.1:8000，所以我运行

ipconfig

在 powershell 中，获取我的 Ipv4 地址，输入我的请求： “http://172.20.10.2:8000/api/beers”

我读到 ios 不允许 http 协议，所以我在 app.json -> infoPlist -> NSAppT运行sportSecurity -> true

    "ios": {
      "supportsTablet": true,
      "infoPlist": {
        "NSAppTransportSecurity" : {
          "NSAllowsArbitraryLoads" : true,
        }
      }
    }

。就像所有其他主题所说的那样，但总是出现相同的错误："Network request failed"

我在（iOS 设备和 android 模拟器）中都连接到同一个网络。

例如，我试过“https://anapioficeandfire.com/api/characters/583”，它可以在我的模拟器和我的 iOS 设备上运行。

我正在使用其他 API，但有 'https' 启动的。这里的问题似乎是 'http'.

但是我试图通过在 app.json 的 infoPlist 中添加 "NSAppTransportSecurity" : "true" 来修复它，但没有任何改变。就像我说的上层。

我也试过在其他家里连接到互联网，更改 IPv4。但问题依旧。

我看不到其他修复方法。我可能错过了什么。

这里是允许请求的函数

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) => response.json())
        .catch((error) => console.log(error));
}


  _searchBeersFromRatio(){
    this.setState({
      beers: [],
    },
    () => {
      this._loadBeersFromRatio()
    })
  }



  _loadBeersFromRatio(){
    console.log('====================================');
    console.log('       NEW REQUEST                   ');
    console.log('====================================');
    this.setState({ isLoading: true })
    getsBeersFromRatio().then(data => {
      console.log(data);

    })
  }


    <Button
      title = "get data from API"
      onPress = {() => this._searchBeersFromRatio()}
    />

这是我的package.json：

{
  "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
}

这是我的 app.json

{
  "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,
        }
      }
    }
  }
}

预期行为

我希望得到与我的 android 模拟器

相同的日志

实际行为

实际输出为"Network request failed"

谢谢！

Answer 1

解决方法：

我终于找到了解决方法：

当我在电脑上输入 http://"My_IPv4_address":8000/"My_Api" 时，他说："ERR_CONNECTION_REFUSED"

所以我尝试运行 $ php bin/console server:run "My_IPv4_address":8000

防火墙通知出现在我面前，我接受它。我在我的 iOS 设备中再次发送我的请求，但我不知道为什么它现在可以工作了。

所以我需要运行

$ php bin/console server:run

并在另一个 powershell 中

$ php bin/console server:run "My_IPv4_address":8000

在我的 android 模拟器和我的 iOS 设备中访问我的本地 API。

Answer 2

我遇到了完全相同的问题，我使用 fetch() 将我的数据从我的本机 React 应用程序发送到我的 php 服务器，我从我的 iOS [=23= 模拟] 与 expo 但我在配置正确的 IPV4 地址时收到与您相同的错误

fetch (http: // ipv4 address / ...)

而不是本地主机。

另外，当我在我的电脑上模拟网络视图时，我把

fetch (http: // localhost / ..)

我收到数据，一切正常。

iOS 设备上的网络请求失败 ||反应本机 ||博览会

Network request failed on iOS device || React-Native || expo

react-native

expo

api-platform.com