无法从 React Native 移动应用程序向 Localhost 后端发送 HTTP 请求答案

【问题标题】：Can't send HTTP requests to Localhost Backend from React Native Mobile App无法从 React Native 移动应用程序向 Localhost 后端发送 HTTP 请求
【发布时间】：2023-03-09 22:10:02
【问题描述】：

2022年的第一天~！学习移动应用程序开发令人头疼。设置起来不会这么难。我已经浪费了6个小时。请帮忙！

情况我的开发环境通过托管在 Windows 10 上的 VMWare 在 Ubuntu 中运行。在这个环境中，我有：

在本地主机上运行的 Node/express 后端 API，在使用 Postman/浏览器测试时可以正常工作
通过 Expo 创建和运行的默认反应原生应用程序。我通过阅读 Expo/metro 提供的二维码（通过 Tunnel 提供服务）在我的 Android 手机上测试此应用

期望的行为：

React Native 移动应用应该能够与后端 API 通信

错误：

Network Error
at node_modules/axios/lib/core/createError.js:15:17 in createError
at node_modules/axios/lib/adapters/xhr.js:114:22 in handleError
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:609:10 in setReadyState
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:396:6 in __didCompleteResponse
at node_modules/react-native/Libraries/vendor/emitter/_EventEmitter.js:135:10 in EventEmitter#emit

来自 React Native 的 Axios 发布请求（缩写）

axios.post('http://localhost:5000/user/login', some-data)

尝试的解决方案

将“localhost”替换为 10.0.2.2 和 127* 的变体
通过 Expos 连接（LAN 或本地而不是隧道）但无法连接（超时错误）
使用 Ubuntu ufw 防火墙设置（禁用、允许端口）
通过安装 Android Studio 来模拟全部忽略，但被告知我的设备不支持 SVM 或 at-x 硬件虚拟化，这导致我陷入另一个兔子洞

【问题讨论】：

标签： android node.js react-native expo mobile-development

【解决方案1】：

使用像 192.xxx.xx.xx 这样的本地 ip 可以解决 localhost 无法工作的问题

【讨论】：

我的 Ubuntu 上似乎没有 192.XX ip。它是一个通过 VMWare 的来宾操作系统。我使用的只有 192 是 DNS 但仍然错误

【解决方案2】：

所以我意识到我做错了什么。

当我运行 adb reverse 时，我使用了在教程和 stackfoverflow 问题中使用的端口（因为通常这些是默认值）。但是您需要使用后端 API 正在侦听的端口。

对于其他人来说，完整的指南是：如果您的后端 API 正在侦听 'localhost:5000' 并且如果您的本机应用程序正在通过本地博览会运行（它会说 Metro 正在终端中的 127* 上侦听，如果设置为 LAN，则为 10*）然后在 API 请求中将 localhost 替换为上面 expo 中列出的 IP（127 或 10）并在终端'adb reverse tcp:5000 tcp:5000'

总结：

adb 反转后端 api 正在侦听的端口
当您开始使用 expo 进行本机反应时，将 localhost 替换为终端中 Metro 列出的 ip

【讨论】：