访问localhost api时如何修复react-native中的网络错误

Question

我们正在尝试通过本地主机从 react-native（0.59 版）连接到 API（.net core 2.2），两者显然都运行在相同的 ip、不同的端口上，react-native 在端口 8080 上，api 在44344，问题发生在我们从 react-native 获取 url 的那一刻

我们还测试了从 Postman 运行 url，一切似乎都正常，也从安装的任何 Web 浏览器（safari/chrome），甚至我们测试了浏览器 INSIDE react-native iOS，并且它工作正常。

任何在 localhost 之外运行的 api 都可以完美运行，如果我们失败了，那就是 localhost。

Network request failed.

onerror
    whatwg-fetch.js:504:29
dispatchEvent
    event-target.js:172:43
setReadyState
    XMLHttpRequest.js:580:29
__didCompleteResponse
    XMLHttpRequest.js:394:25
emit
    EventEmitter.js:190:12
__callFunction
    MessageQueue.js:366:47
<unknown>
    MessageQueue.js:106:26
__guard
    MessageQueue.js:314:10
callFunctionReturnFlushedQueue
    MessageQueue.js:105:17
callFunctionReturnFlushedQueue
    [native code]:0

获取api的部分代码（函数），非常简单（暂时）

async Submit(){
  //GET METHOD
  try {
        let response = await fetch('https://192.168.1.56:44344/api/values');
        let responseJson = await response.json();
        return Alert.alert(JSON.stringify(responseJson));
  } catch (error) {
        console.error(error);
  }
}

好的，首先，我们已经尝试了所有可能的解决方案，将我的 react native 应用程序连接到我的 .net core api rest，两者都在 localhost 中运行，这是迄今为止我们尝试过的事情的列表，仍然没有结果。

• 本地主机
• 127.0.0.1
• 电脑ip（网络ip不是mac地址）
• React Native 空白项目（从头开始）
• API .net 核心空白项目（从头开始）
• 跑零食博览会+api .net core
• ip 转发（我们不能这样做对我们的工作政策/不是我们正在寻找的解决方案）
• http/https
• 不同的端口
• 来自 react-native 的 Android 和 ios 权限
• 相同的网络不同的 ip（这有点工作，但我们不知道为什么它在同一 ip (localhost) 中运行 react-native 和 api 不起作用）
• 10.0.2.2（安卓）
• 在 api .net core 上启用 cors（但显然这不适用于本机应用程序，仅适用于网络）
• 通过 ngrok/serveo 公开 ip（我们不能这样做对我们的工作政策/不是我们正在寻找的解决方案）
• 飞盘
• 阿克西奥斯
• Websocket（我们不能这样做对我们的工作政策/不是我们正在寻找的解决方案）
• XMLHttpRequest（状态码错误 0）
• 防火墙/代理（我们的网络没有防火墙和代理）
• Web 浏览器插件（已停用和/或已卸载）
• 缓存/cookies
• Docker（我们不能对我们的工作政策这样做/不是我们正在寻找的解决方案）
• 重启我的 macbook pro

我们期望 react native 获取 api，因此我们可以继续进行 office 365 登录身份验证。

编辑：我刚刚发现获取机器 ip（这次运行 Windows），我的 ip 在 api 和 react native 上都是 192.168.0.9，获取结果向我显示了 json 标题中的 10.0.2.2:80响应，我想这是来自 react native 的“localhost”ip，如果 react native 显然不让我这样做，我该如何从 localhost 获取 ip。

编辑：这次我们不得不采用计划 B，我们让它与 api 上的 docker 一起工作，但我需要一个解决方案来解决这个问题，我 99% 确定问题是反应原生的，没有别的

编辑：解决了！！！！经过这几周我的一个大学设法解决了它，他就是这样做的，首先，我的 macbook pro 中的防火墙是一块垃圾，我们无法使其正常工作，其次，我们解决了然后发现我们的 api 有问题，所以他发现重定向是在 https 上的，而且认证没有正常工作，所以他改变了这个

"applicationUrl": "http://192.168.0.114:5001;https:192.168.0.114:5001"

到

"applicationUrl": "http://192.168.0.114:5001"

Answer 1

我在从 react-native 获取 localhost API 时遇到了同样的问题。这是我为解决此问题所做的工作。在启动类中，我删除了 //app.UseHttpsRedirection(); 来自配置方法。（不确定是否需要）

之后在properties文件夹下的launchsetting.js文件中，我从

"applicationUrl": " https://localhost:5001;http://localhost:5000 "

到 “applicationUrl”：“ http://localhost:5000 ”

在 React 原生部分，我只是用我的 IP 更改了我的本地主机：

fetch(' http://localhost:5000/values/ ') to fetch(' http://127.0.0.1:5000/values/ ')

这完全对我有用