React Native应用程序出错.错误为`[AxiosError:网络错误]`

Question

我可以在React应用程序中轻松获取数据。但是当我要在React Native应用程序中获取数据时。显示[AxiosError: Network Error]错误。

axios
.get(`http://localhost:8000/api/products`)
.then(res => setProducts(res?.data))
.catch(error => console.log(error));
}, []);

Answer 1

我假设您正试图从模拟器进行调用？

如果是，localhost将不起作用。取决于你是在运行ios还是android，你必须调用

适用于Android的10.0.2.2或适用于ios的127.0.0.1。(我知道127.0.0.1应该与localhost相同，但在ios模拟器中似乎不是这样。很想知道为什么会这样。(

这里有更多信息

Answer 2

嘿，您无法直接将localhost与您的react原生develpoment连接，因为它已经分配了一个运行端口。

你可以查看这篇文章，这篇文章对如何使用cinfugyre有很大的解释。React Native Android Fetch在连接到本地API 时失败

基本上，您必须通过ADB 将您的港口映射到

这是准确的报价：

您无法访问本地开发服务器，因为ADB尚未转发该端口。当您运行react native run android时，react native会将端口8081映射到USB上的移动设备。当你断开USB连接时，你将无法再刷新或热重新加载你的代码。因此，在这种情况下，您可以做两件事，要么像React Native一样映射您的本地服务器端口，要么使用您的本地IP地址

如果有任何问题，请告诉我