如何在 Android 设备上运行带有 Node js 后端的 React Native 应用程序?

IT技术 android node.js reactjs api
2021-05-10 13:55:12

我想在我的本地 Android 设备上运行我的 React Native 应用程序。该应用程序使用 Node js API 从 mysql 获取数据。问题是,我的 android 设备无法访问 node js 应用程序,导致没有数据。该应用程序在使用地址 10.0.2.2 的 Android Emulator 上运行良好,但无法在 Android Device PS 上访问该节点 js API 是本地服务器 (localhost:3000)

4个回答

所以我是这样解决的。1. 我使用 ipconfig 从 cmd得到了我的ip 地址2. 在 node js 中,我写了这样的服务器监听代码

const hostname = "192.168.2.103";
const port = "3002";
app.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
});

现在应用程序将在这个 IP 地址而不是本地主机上运行,​​因此我们可以在同一网络上的任何地方访问它,即使是在React Native 从 API 进程中获取

那是因为当您在手机上运行 React Native 应用程序时,您不再在您的计算机上,因此,本地主机(您的计算机)不再可访问。尝试使用完整的 IP 地址,即使在本地环境中也是如此。

假设您使用 axios 攻击您的 api 到 localhost:3000,您应该将此 localhost 更改为您计算机的 ip。那么它应该工作。

将您的移动设备连接到与您的机器相同的网络

然后试试这个命令:

ifconfig

从日志中找到您机器的 IP 地址。你会发现这样的事情:

en0: flags=8863<UP,BROADCAST,SMART,RUNNING,SIMPLEX,MULTICAST> mtu 1500
    options=400<CHANNEL_IO>
    ether a4:83:e7:d5:35:85 
    inet6 fe80::439:b3fe:c51a:364%en0 prefixlen 64 secured scopeid 0x6 
    inet 192.168.1.6 netmask 0xffffff00 broadcast 192.168.1.255
    nd6 options=201<PERFORMNUD,DAD>
    media: autoselect
    status: active

获取地址,在我的情况下是这样的:inet 192.168.1.6

在您的应用程序上,输入此地址以访问节点服务。192.168.1.6. 如果节点在 上运行port 3000,则直接添加到地址中。 192.168.1.6:3000

您必须在 android 设备中使用adb reverse.

例如,如果您的 API 处于开启状态localhost:3000,请运行以下命令:

$ adb reverse tcp:3000 tcp:3000

现在,当您的手机尝试向localhost:3000发出请求时,它将路由到您笔记本电脑中的该地址。

不要忘记在运行该命令后重新编译您的应用程序。

参考及更多信息:

  1. https://blog.grio.com/2015/07/android-tip-adb-reverse.html

  2. https://www.jaygould.co.uk/2018-11-07-react-native-connecting-development-server-debugging/