应用内浏览器可为用户提供完整的 Web 体验,而无需离开您的应用。Android 提供了两个主要 API 来实现应用内浏览器:自定义标签页和 WebView。当您有指向网页的链接或广告时,请使用应用内浏览器。您可以在应用内直接打开该页面,如图 1 所示。
在自定义标签页和 WebView 之间做出选择是一项重大的架构决策,会影响您的开发速度、用户体验以及您对界面的控制程度。
快速对比
请参考下表,确定哪种工具符合您的需求:
| 功能 | WebView | 自定义标签 |
|---|---|---|
| 主要应用场景 | 构建以 Web 作为主要或辅助内容的混合应用,展示广告、应用广告系列或服务条款页面。 | 显示外部网站的内容(例如新闻报道或商品页面)。 |
| 界面控件 | 完整。它是一个 View 组件,您可以将其放置在任何位置。您可以控制所有周围的界面。 |
受限。您可以为工具栏颜色设置主题,并添加一些自定义操作。 |
| 数据和会话 | 沙盒化。它不会与用户的主浏览器共享 Cookie 或登录信息。 | 共享。它会使用用户的默认浏览器会话,包括 Cookie 和已保存的密码。 |
| 原生 <-> Web 桥接 | 是。您可以使用 JavaScript 桥接,在 Web 内容与原生应用代码之间实现深度双向通信。 | 受限。您可以使用 window.postMessage() 方法进行基本字符串传递。 |
| 开发者工作量 | 高。您需要自行管理生命周期、导航和性能。 | 低。只需几行代码即可实现。 |
WebView
WebView 是一种视图,可让网页成为应用布局不可或缺的一部分。 它功能强大,但与自定义标签页相比,处理起来稍微复杂一些。
WebView 可以加载远程或本地 Web 内容、执行 JavaScript,并支持 Web 内容与原生应用代码之间的双向通信。如需详细了解其功能,请参阅 WebView 的功能。
您还可以使用 WebView 交付 Web 应用或在应用中显示在线网页。例如,您需要定期更新的最终用户协议。如需了解详情,请参阅在 WebView 中构建 Web 应用。
为何应选择 WebView
以下是 WebView 适用的一些场景:
- 混合应用:您正在构建一款应用,其中 Web 内容和原生组件(例如导航栏或悬浮操作按钮)并存。
- 第一方内容:您的 Web 内容是应用体验的核心互动部分,例如文档编辑器或设计画布。
- 完全控制界面:您需要修改网页本身的内容,或在网页上叠加原生界面元素。
- 深度分析:您需要详细了解 WebView 中的用户互动和活动。
关键权衡因素
以下是使用 WebView 时需要考虑的一些关键权衡:
- 性能:WebView 可能会占用大量内存。如果您不谨慎管理,可能会遇到性能问题或 ANR(应用无响应错误)。
- 安全和维护:您负责强化安全性和管理生命周期。这包括使用
WebViewCompat.saveState()管理进程重新创建期间的状态保留,并遵守 Android 的 1MB 已保存状态事务限制。不过,WebView 更新会通过 Google Play 在全球范围内发布,因此您不必担心底层引擎过时。
自定义标签
自定义标签页是引导用户访问外部网址的绝佳选择,因为它们提供了一个快速、安全且人性化的浏览器窗口,该窗口会在应用上方滑动。
为何应选择自定义标签页
以下是一些适合使用自定义标签页的场景:
- 外部链接:当用户点按指向您不拥有的网站的链接时,自定义标签页可让用户留在应用上下文中,同时提供全功能浏览器体验。
- 易于集成:这是启动和运行嵌入式 Web 体验的最简单方法。
- 共享状态:由于它与用户的默认浏览器共享 Cookie,因此用户无需再次登录他们已经访问过的网站。
- 第三方登录:它们非常适合第三方登录流程(例如“使用 Google 账号登录”或“使用 Facebook 账号登录”),因为浏览器会安全地处理凭据。
虽然大多数浏览器都支持自定义标签页,但有些浏览器提供的自定义选项比其他浏览器更多。如需了解详情,请参阅浏览器支持。
在 Jetpack Compose 中使用 Web 内容
使用 Jetpack Compose 构建应用时,您可以同时使用自定义标签页和 WebView:
- 自定义标签页:由于自定义标签页使用
Intent,因此您可以从 Compose 函数中的任何Context启动它们,从而实现无缝集成。 - WebView:Compose 尚无原生 WebView 可组合项,因此您需要使用
AndroidView将标准 WebView 嵌入到布局中。
其他资源
如需使用 WebView 或 Custom Tabs API 为 Android 设备开发网页,请参阅以下文档: