react-native - 如何通过 Xcode 将 React Native iOS 应用程序构建到设备？

Question

我尝试将AwesomeProject应用程序构建到设备。构建成功并显示初始屏幕，但随后我看到红色的“无法连接到开发服务器”屏幕。它说“确保节点服务器正在运行 - 从 React root 运行'npm start'。”

看起来节点服务器已经在运行，因为当我这样做时，npm start我收到一条EADDRINUSE消息，说端口已经在使用中。

Answer 1

从设备访问开发服务器您可以使用开发服务器在设备上快速迭代。为此，您的笔记本电脑和手机必须在同一个 wifi 网络上。

1. 打开 iOS/AppDelegate.m
2. 将 URL 中的 IP 从 localhost 更改为笔记本电脑的 IP
3. 在 Xcode 中选择您的手机作为构建目标，然后按“构建并运行”

ps： http: //facebook.github.io/react-native/docs/runningondevice.html#content

Answer 2

另一个潜在问题（这发生在我身上）：即使您进行了所有必要的代码更改（参见http://moduscreate.com/automated-ip-configuration-for-react-native-development/以获得良好的演练） , 启动服务器等，可能还是会因为App Transport Security失败。您需要将您的 IP 地址添加到NSExceptionDomains应用程序Info.plist文件的列表中，或者完全禁用 ATS（不鼓励 - 阅读上面的文章以了解原因）。

示例条目：

  <key>NSAppTransportSecurity</key>
  <dict>
    <key>NSExceptionDomains</key>
    <dict>
      <key>YOUR-IP-HERE</key>
      <dict>
        <key>NSTemporaryExceptionAllowsInsecureHTTPSLoads</key>
        <false/>
        <key>NSIncludesSubdomains</key>
        <true/>
        <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
        <true/>
        <key>NSTemporaryExceptionMinimumTLSVersion</key>
        <string>1.0</string>
        <key>NSTemporaryExceptionRequiresForwardSecrecy</key>
        <false/>
      </dict>
    </dict>
  </dict>

Answer 3

1. 查看您的 AppDelegate.m 文件
2. 找到“选项 1”和“选项 2”注释块。它们位于“@implementation AppDelegate”行之后。
3. 确保只有块中的最后一行没有注释掉。
4. 对于您选择的选项，请务必按照有关如何加载文件的说明进行操作。

另请注意，您的计算机和手机必须连接到同一个 wifi 网络。

根据 AppDelegate.m 中的表扬：

要在设备上运行，请更改localhost您电脑的 IP 地址，并确保您的电脑和 iOS 设备在同一个 Wi-Fi 网络上。

Answer 4

在AppDelegate.m：

To run on device, change localhost to the IP address of your computer, and make sure your computer and iOS device are on the same Wi-Fi network.

我在 react-native github 问题上发现了一个相关问题。

在没有服务器的情况下运行应用程序的说明：https ://github.com/facebook/react-native/issues/240

Answer 5

这应该不再是一个问题。您应该能够遵循文档，其中说明了以下内容：

1. 通过 USB 连接您的设备
2. 将您的设备连接到与运行 Xcode 的笔记本电脑相同的 wifi 网络
3. 在 Xcode 界面中单击 build in run（左上角的“播放”按钮）并选择您的设备。