跳到主要内容

介绍新的 iOS WebViews

·2 分钟阅读
Ramanpreet Nara
Facebook 软件工程师

长期以来，Apple 一直不鼓励使用 UIWebView，而是推荐使用 WKWebView。在即将发布的 iOS 12 中，UIWebView 将被正式弃用。React Native 的 iOS WebView 实现严重依赖 UIWebView 类。因此，鉴于这些发展，我们为 WebView React Native 组件构建了一个新的原生 iOS 后端，该后端使用 WKWebView。

这些更改的尾声已在 此提交 中落实，并将在 0.57 版本中提供。

要选择加入此新实现，请使用 useWebKit 属性

<WebView
  useWebKit={true}
  source={{url: 'https://www.google.com'}}
/>

改进​

UIWebView 没有合理的方式来促进 WebView 中运行的 JavaScript 与 React Native 之间的通信。当从 WebView 发送消息时，我们依赖一种 hack 方法将其传递给 React Native。简而言之，我们将消息数据编码到一个带有特殊 scheme 的 URL 中，并将 WebView 导航到该 URL。在原生端，我们拦截并取消此导航，从 URL 解析数据，最后调用 React Native。此实现容易出错且不安全。我很高兴地宣布，我们已经利用 WKWebView 功能完全替换了它。

WKWebView 相对于 UIWebView 的其他优势包括更快的 JavaScript 执行速度和多进程架构。请参阅 2014 年 WWDC 了解更多详细信息。

注意事项​

如果你的组件使用以下属性，那么切换到 WKWebView 时可能会遇到问题。目前，我们建议你避免使用这些属性

行为不一致

automaticallyAdjustContentInsets 和 contentInsets (提交)

当你向 WKWebView 添加 contentInsets 时，它不会更改 WKWebView 的视口。视口大小与帧大小保持一致。使用 UIWebView 时，视口大小实际上会更改（如果内容内边距为正值，则会变小）。

backgroundColor (提交)

使用 WebView 的新 iOS 实现，如果你使用此属性，则背景颜色可能会闪烁可见。此外，WKWebView 渲染透明背景的方式与 UIWebview 不同。请查看提交说明以了解更多详细信息。

不支持

scalesPageToFit (提交)

WKWebView 不支持 scalesPageToFit 属性，因此我们无法在 WebView React Native 组件上实现此功能。