React Native应用在模拟器上能正常运行但在设备上却卡在启动画面

Question

我的React Native应用在XCode模拟器中运作正常，但是当我在物理设备上，我的iPhone上运行时会出现问题。应用程序启动后停留在React Native启动画面，并在10-15秒后崩溃/关闭。这是什么原因，如何预防？

- Thomas Charlesworth

---

我有一个类似的问题。我的应用程序可以在iPhone 5S及以上的模拟器和设备上运行。但是，在iPhone 5和4S上登录后，应用程序会自动关闭。 - milkersarac

我遇到了完全相同的问题，我的应用在iOS模拟器上运行得非常好，但在第一次加载后无法在我的设备上工作。 - Vipin Dubey

Answer 1

看起来我已经找到了问题所在。根据https://facebook.github.io/react-native/docs/running-on-device，当你在设备上构建和运行应用程序时，你的应用程序将从计算机上的打包器中加载js文件，因此你可以实时重新加载你的应用程序。这意味着你的设备必须连接到你的计算机或与你的计算机在同一wifi网络中。如果你的设备无法访问打包器，它将卡在启动画面并退出。

为了可靠地在你的设备上运行，请编辑构建方案并构建发布版本。

- Guannan He

---

我们看到的情况是一样的，当手机没有连接 WiFi 时，应用程序会超时（或在相当长的时间后显示“无捆绑 URL 存在”）。通过 Product -> Scheme -> Edit Scheme 并将 Run 步骤切换到 Release 来解决问题。 - Freewalker

这对我来说也是如此。谢谢。 - lmiller1990

我在同一网络上，但即使切换到发布模式也没有运气。 - Sujit

将手机和电脑都切换到同一个WI-FI网络对我很有帮助。谢谢！ - Gabriel Arghire

在切换到发布模式后，仍然无法正常工作（第一次） - 提示我的iPhone未连接。 必须拔下并重新插入手机，并不断尝试发布版本，直到它正常工作。 - velkoon

缺乏对用户的任何提示感到困惑。 - user5305519

Answer 2

对我来说，当我构建时，在模拟器中一切正常，但在实际设备上只有启动画面出现，其他什么也没有。

这是因为我的构建配置是调试模式，我想这是默认的。我必须将发布/构建配置从调试改为发布，然后一切都按预期工作了。

- Anjum....

---

这将禁用调试/开发者菜单。 - user5283119

亲爱的@Anjum。在存档部分，我正在使用Debug而不是Release。我想创建一个归档并将其推送到TestFlight。我遇到了这个问题。我应该使用Release吗？ - Kasra

Answer 3

是的，我在手机上禁用了WiFi。启用WiFi后，一切正常。

- Mark

---

拯救我于困境之中。诀窍在于将手机和MacBook连接到同一个WiFi上。嘭，它就开始工作了。 - Gautham Vijayan

Answer 4

完全可以在设备上进行调试而无需连接打包程序！您需要使用 react-native bundle 创建一个离线包，并将其添加到 Xcode 项目中。然后，当打包程序不可用时，您的应用程序应该回退到该离线包。

这个内容以前在“部署到设备”FB文档中，不确定为什么现在没有了。

示例调用（我们的index.ios.js由TypeScript放置在./dist中）：

react-native bundle --dev true --assets-dest ./ios --entry-file ./dist/index.ios.js --platform ios --bundle-output ios/main.jsbundle

此外，显然需要告诉你的应用程序直接从软件包中运行，而不是尝试访问开发服务器，这似乎会导致超时（我们和OP遇到了相同的问题）。

请注释掉这行代码：

jsCodeLocation = // whatever

并添加这一行：

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

- Freewalker

---

我总是创建bundle，但不更改jsCodeLocation。我没有遇到任何超时问题，但仍然遇到了此问题。 - Kasra

Answer 5

我尝试断开我的iPhone与互联网的连接，在后续启动中问题消失了。

因此，某些东西正在尝试进行网络操作并导致延迟。这是一个快速解决方案，但在我们找到具体的罪魁祸首之前，它会起作用。

- Guy

Answer 6

我遇到了同样的问题。我在Xcode中进行了以下操作：进入 产品 -> 方案 -> 编辑方案 -> 选择“运行”选项卡 -> 将构建配置更改为发布（默认为调试模式），然后在设备上运行应用程序。

这样可以使应用程序运行速度更快，并且像本机应用程序一样运行。

- Udaya Sri

Answer 7

我刚刚经历了这个问题，在调试了一个小时后才意识到我最近启用了系统防火墙并将其设置为“阻止所有传入连接”。

奇怪的是，Android 在物理设备上正常运行，但 iOS 在物理设备上无法连接到 RN 服务器。放松防火墙规则，现在 iOS 可以连接到 RN 服务器。

- b.stevens.photo

Answer 8

您可能需要对该应用进行签名。

在项目导航器下，单击您的应用程序。然后从项目和目标列表中选择您的目标。在“常规”选项卡中，找到“签名”部分。您需要在此指定一个团队。

有关更多信息，请参见此链接：https://developer.apple.com/library/content/documentation/IDEs/Conceptual/AppDistributionGuide/LaunchingYourApponDevices/LaunchingYourApponDevices.html#//apple_ref/doc/uid/TP40012582-CH27-SW4

- TheJizel

Answer 9

此问题可能由以下原因引起：

1. 您的运行模式设置为“发布”而不是“调试”，因此始终期望加载“main.jsbundle”，而不是从调试服务器运行。更改方法为：Product->Schema->Edit Schema->Run->Build Configuration: Debug。

2. （-1004）您已经从头开始配置了XCode项目，但忘记在Build Phases中输入react-native xcode脚本。

对于React Native 50以下版本：

export NODE_BINARY=node ../node_modules/react-native/packager/react-native-xcode.sh

对于React Native 50以上版本：

export NODE_BINARY=node ../node_modules/react-native/scripts/react-native-xcode.sh

请检查Xcode日志中是否有任何消息，例如NSURLConnection finished with error - code -1004或NSURLConnection finished with error - code -1022。前往Project->Target->Build Phases->+- > New Run Script Phase。

(-1022) 您的应用程序ATS问题，请检查Info.plist文件，您可以使用以下代码关闭ATS： <key>NSAppTransportSecurity</key> <dict> <key>NSAllowsArbitraryLoads</key> <true/> </dict>

- gauravds

Answer 10

在我的项目中，我使用Firebase框架。我忘记将GoogleService-Info.plist文件添加到我的Xcode项目中。添加后，问题消失了。

- Mehmet