Question

我正在创建一个react-native app，我创建的其中一个组件包含一个属性，该属性通过来自http请求的数据填充。

现在我正在从我的笔记本电脑托管服务器，但是我正在使用Expo应用程序在手机上测试应用程序。由于这些是两个独立的设备，http://localhost:3000调用不起作用，因此我无法判断我的组件是否正常工作。

我有什么方法可以在我的笔记本电脑上运行服务器并进行设置，以便来自Expo应用程序的http请求到达服务器？

Answer 1

您可以使用Expo清单在运行时获取IP地址：

import Expo from "expo";
const { manifest } = Expo.Constants;
const api = (typeof manifest.packagerOpts === `object`) && manifest.packagerOpts.dev
  ? manifest.debuggerHost.split(`:`).shift().concat(`:3000`)
  : `api.example.com`;

这会将api常量设置为开发模式下本地开发计算机的地址以及您在生产中使用的任何地址。请注意，通过App Store / Play商店部署的应用似乎具有packagerOpts undefined。这就是我们有额外typeof条件的原因。在这种情况下，我们假设它是生产构建。

有关此处清单的更多信息：https://docs.expo.io/versions/latest/guides/how-expo-works.html#expo-manifest

Answer 2

要添加到Tadeusz's answer，在当前版本的Expo（我现在是32.0.0）中，您将导入Constants而不是Expo（即使常数在文档中被称为Expo.Constants.manifest），因此看起来像

import { Constants } from 'expo';
const { manifest } = Constants;

此外，要使所有地址正常工作，必须在生成的地址前加上协议。

Answer 3

您应该使用计算机的IP地址替换http://localhost:3000/地址。

在Windows上，打开提示并键入ipconfig，检查网络接口的行并获取地址IPV4，应该看起来像192.168.1.20。然后，您可以使用fetch和一个类似htt://192.168.1.20/routname的网址进行通话。

顺便说一下，您的计算机（服务器）和设备必须位于同一本地网络上。 Wifi和lan共享同一个网络。

Answer 4

在我一生中，我无法找到任何可行的解决方案（包括此页面上的所有解决方案）。我花了几天时间尝试。最后，我只是放弃并通过使用localtunnel来解决整个问题，并将在localhost:8080上运行的服务公开到网络上。从我的博览会应用程序调用它时先尝试过。也许不是最大的长期解决方案，但也没有那么糟糕。我希望这对其他人有帮助！

Answer 5

另一个简单的方法。首先，您需要使用Mobile HotSpot并使用Mobile HotSpot连接到笔记本电脑。然后检查您的ip分配给您的计算机并将api url http://localhost:80/地址替换为您使用的react-native源中的http://192.168.5.43:80/。

将端口80替换为您的api服务器端口号

确保您在笔记本电脑的防火墙中打开了服务器端口（80）。

在Android rest-client https://play.google.com/store/apps/details?id=com.sn.restandroid app中测试api（网址：http://192.168.5.43:80/api）

Answer 6

import Constants from "expo-constants";

const { manifest } = Constants;
const uri = `http://${manifest.debuggerHost
  .split(`:`)
  .shift()
  .concat(`:4000`)}`;

Answer 7

我尝试了其中的一部分，但是没有用，最后只使用了ngrok

Answer 8

如果使用 laravel artisan serve，请将您的计算机 ip 作为主机参数传入：

php artisan serve --host 192.168.0.19 --port 8000

Answer 9

Divyanshu Singh 详细解释了如何从 Expo 调用本地托管服务器并提供一些解决方案：

通过使用 ngrok 或 localtunnel
通过在 0.0.0.0 上运行服务器（这个解决方案对我有用)

https://dsinecos.github.io/blog/How-to-call-a-locally-hosted-server-from-expo-app

从Expo App调用本地托管服务器

9 个答案: