离线支持


你的应用会遇到网络连接不佳或完全不可用的情况,但仍然需要合理地运行。本指南提供了更多信息和最佳实践,以便在设备离线时提供出色的体验。

¥Your app will encounter circumstances where the internet connection is sub-par or totally unavailable, and it still needs to work reasonably well. This guide offers more information and best practices for providing a great experience while the device is offline.

后台加载 JS 更新

¥Load JS updates in the background

当你对应用进行 publish 更新时,你的用户将在更新中收到新版本的代码。新版本将在下次应用启动时或下次你致电 Updates.reload() 时下载。此行为也适用于用户第一次打开你的应用时。

¥When you publish an update to your app, your users will receive the new version of your code in an update. The new version will download either the next time the app starts or the next time you call Updates.reload(). This behavior also applies the very first time the user opens your app.

Expo 提供了多种关于如何下载 JS 的行为。它可以使用 启动画面AppLoading 组件 阻止 UI,直到下载新的 JS,或者它可以立即显示 JS 的旧版本并在后台下载更新。如果你的用户必须始终拥有最新版本,则前一个选项更好;如果你的互联网连接状况不佳并且需要立即显示某些内容,则后一个选项会更好。

¥Expo offers multiple behaviors for how it should download your JS. It can either block the UI with a splash screen or AppLoading component until the new JS is downloaded, or it can immediately show an old version of your JS and download the update in the background. The former option is better if your users must have the latest version at all times; the latter option is better if you have a bad internet connection and need to show something right away.

要强制 JS 更新在后台运行(而不是在应用启动时同步检查和下载),请在 app.json 中将 updates.fallbackToCacheTimeout 设置为 0。你还可以收听新版本何时完成下载。欲了解更多信息,请参阅 配置更新

¥To force JS updates to run in the background (rather than synchronously checking and downloading on app start), set updates.fallbackToCacheTimeout to 0 in app.json. You can also listen to see when a new version has finished downloading. For more information, see configuring updates.

下载后缓存你的资源

¥Cache your assets after downloading

默认情况下,当你向应用发布更新时,所有资源(图片、字体等)都是 上传至 Expo CDN。下载后,你可以 缓存它们,这样你就无需再次下载它们。如果你发布更改,缓存将失效并下载更改的版本。

¥By default, all of your assets (images, fonts, and so on) are uploaded to Expo's CDN when you publish updates to your app. Once they're downloaded, you can cache them so you don't need to download them a second time. If you publish changes, the cache will be invalidated and the changed version will be downloaded.

将你的资源打包到独立的二进制文件中

¥Bundle your assets inside your standalone binary

Expo 可以在构建过程中将资源打包到你的独立二进制文件中,以便即使用户以前从未运行过你的应用,它们也可以立即可用。如果出现以下情况,这一点很重要:

¥Expo can bundle assets into your standalone binary during the build process so that they will be available immediately, even if the user has never run your app before. This is important if:

  • 你的用户第一次打开你的应用时可能没有互联网,或者

    ¥Your users may not have internet the first time they open your app, or

  • 如果你的应用依赖大量资源才能使第一个屏幕正常运行。

    ¥If your app relies on a nontrivial amount of assets for the very first screen to function properly.

EAS 构建

¥EAS Build

使用 eas build 时,expo publish 不会作为构建过程的一部分运行,因此 assetBundlePatterns 键在这种情况下不适用。相反,代码库中任何位置(包括依赖中)显式 require() 的任何资源都会打包到你的二进制文件中。这与使用 Xcode 或 Android Studio 直接构建的常规 React Native 应用的行为相同。

¥When using eas build, expo publish is not run as part of the build process, so the assetBundlePatterns key doesn't apply in this case. Instead, any assets that are explicitly require() anywhere in your codebase (including in your dependencies) are bundled into your binary. This is the same behavior as with regular React Native apps built directly with Xcode or Android Studio.

经典构建

¥Classic builds

要将资源打包到二进制文件中,请使用 app.json 中的 assetBundlePatterns 键来提供项目目录中的路径列表:

¥To bundle assets in your binary, use the assetBundlePatterns key in app.json to provide a list of paths in your project directory:

下次运行 expo build 时,路径与给定模式匹配的图片将被打包到你的原生二进制文件中。

¥Images with paths matching the given patterns will be bundled into your native binaries next time you run expo build.

监听网络可用性的变化

¥Listen for changes in network availability

React Native 社区创建了 @react-native-community/netinfo 包,它会通知你设备的可达性是否发生变化。如果你发现没有可用的连接,你可能需要更改 UI(例如,显示横幅或禁用某些功能)。

¥The React Native community created the @react-native-community/netinfo package, which informs you if your device's reachability changes. You may want to change your UI (for example, show a banner, or disable some functions) if you notice that there's no connection available.

Expo 中文网 - 粤ICP备13048890号