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

Question

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

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

Answer 1

在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 问题上找到了 related issue。

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

Answer 2

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

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

根据AppDelegate.m中的表扬：

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

Answer 3

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

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

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

Answer 4

另一个潜在问题（这发生在我身上）：即使您进行了所有必要的代码更改（参见http://moduscreate.com/automated-ip-configuration-for-react-native-development/ 以获得良好的演练）、启动服务器等，它仍然可能因为@987654322 而失败@。您需要将您的 IP 地址添加到应用程序的 Info.plist 文件中的 NSExceptionDomains 列表中，或者完全禁用 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 5

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

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