商场
作者 NativeScript.org
@ammarahmed/nativescript-webview
由 ammarahmed 提供 | v1.0.9
一个使用 Open Native 包装流行的 react-native-webview 库的 NativeScript webview 插件。
npm i --save @ammarahmed/nativescript-webview

@ammarahmed/nativescript-webview

一个使用 Open Native 包装流行的 react-native-webview 库的 NativeScript webview 插件。使用功能丰富的 WebView 库无缝地将网络内容集成到您的 NativeScript 应用程序中。

安装

npm install @open-native/core @ammarahmed/nativescript-webview react-native-webview

请按照 Open Native 入门指南 在您的项目中设置 @open-native/core。

使用

核心

  1. 使用页面 xmlns 属性注册插件命名空间，提供您的前缀（例如 ui）。
<Page xmlns:ui="@ammarahmed/nativescript-webview">
  1. 通过前缀访问 WebView 视图。
<Page xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:ui="@ammarahmed/nativescript-webview">
    <ui:WebView source="{{ source }}"/>
</Page>

Angular

  1. 将 NativeScriptWebViewModule 添加到您想要使用视图的模块导入中。
import { NativeScriptWebViewModule } from '@ammarahmed/nativescript-webview/angular';
imports: [NativeScriptWebViewModule];
  1. 在 HTML 中使用视图。
<NSWebView [source]="source"></NSWebView>

Vue

  1. 在 app.ts 文件中注册视图。
import { registerElement } from 'nativescript-vue';

registerElement("NSWebView", ()=> require("@ammarahmed/nativescript-webview").NSWebView)
  1. 在 .vue 文件中使用视图。
<NSWebView :source="source" />

参考

本文件概述了 NativeScript WebView 的当前公共属性和方法。这主要基于原始的 react-native-webview API 参考，有一些小的差异。

来源

在 WebView 中加载静态 HTML 或 URI（可选头信息）。请注意，静态 HTML 需要将 originWhitelist 设置为 ["*"]。

传递给 source 的对象可以有以下两种形状

加载 URI

  • uri（字符串）- 在 WebView 中加载的 URI。可以是本地或远程文件，可以用 React 状态或属性更改以导航到新页面。
  • method（字符串）- 要使用的 HTTP 方法。如果未指定，默认为 GET。在 Android 和 Windows 上，仅支持 GET 和 POST 方法。
  • headers（对象）- 要与请求一起发送的附加 HTTP 头。在 Android 上，这只能用于 GET 请求。有关设置自定义头的更多信息，请参阅指南。
  • body（字符串）- 与请求一起发送的 HTTP 主体。这必须是一个有效的 UTF-8 字符串，并且将按指定方式发送，不应用任何附加编码（例如 URL-转义或 base64）。在 Android 和 Windows 上，这只能用于 POST 请求。

本地文件

将您想要加载的文件放在应用程序的 assets 文件夹中。然后以 URI 的形式传递文件的路径

// Android
`file:///android_asset/app/assets/path/to/your/html/file.html` // iOS
` app/assets/path/to/your/file.html`;

静态 HTML

请注意，使用静态 HTML 需要将 WebView 属性 originWhiteList 设置为 ['*']。对于某些内容，例如视频嵌入（例如 Twitter 或 Facebook 中的视频），需要设置 baseUrl 以使视频播放正常工作

  • html（字符串）- 在 WebView 中显示的静态 HTML 页面。
  • baseUrl (字符串) - 用于HTML中任何相对链接的基本URL。它还用于从WebView发起的CORS请求的源头信息。参见 Android WebView文档
类型 必需
对象 否

automaticallyAdjustContentInsets

控制是否调整放置在导航栏、标签栏或工具栏之后的WebView的内容内边距。默认值是 true。

类型 必需 平台
布尔型 否 iOS

automaticallyAdjustsScrollIndicatorInsets

控制是否调整放置在导航栏、标签栏或工具栏之后的WebView的滚动指示器内边距。默认值 false。 (iOS 13+)

类型 必需 平台
布尔型 否 iOS(13+)

injectedJavaScript

设置此属性以提供在文档加载完成但其他子资源尚未加载之前注入到网页中的JavaScript。

确保字符串评估为有效的类型（true 有效）且不会抛出其他异常。

在iOS上，请参阅 WKUserScriptInjectionTimeAtDocumentEnd。请确保设置一个 onMessage 处理器，即使它是一个空操作，否则代码将不会运行。

类型 必需 平台
字符串 否 iOS, Android

injectedJavaScriptBeforeContentLoaded

设置此属性以提供在文档元素创建后但其他子资源尚未加载之前注入到网页中的JavaScript。

确保字符串评估为有效的类型（true 有效）且不会抛出其他异常。

在iOS上，请参阅 WKUserScriptInjectionTimeAtDocumentStart

警告 在Android上，这可能有效，但并非100%可靠（请参阅 #1609 和 #1099）。请考虑使用 injectedJavaScriptObject。

类型 必需 平台
字符串 否 iOS, Android (实验性)

要了解更多信息，请阅读JS与原生通信指南。

injectedJavaScriptForMainFrameOnly

如果为 true（默认值；对于Android是必需的），则只将 injectedJavaScript 加载到主框架中。

如果为 false，（仅支持iOS），则将其加载到所有框架中（例如iframe）。

类型 必需 平台
布尔型 否 iOS（仅支持Android的 true）

injectedJavaScriptBeforeContentLoadedForMainFrameOnly

如果为 true（默认值；对于Android是必需的），则只将 injectedJavaScriptBeforeContentLoaded 加载到主框架中。

如果为 false，（仅支持iOS），则将其加载到所有框架中（例如iframe）。

类型 必需 平台
布尔型 否 iOS（仅支持Android的 true）

injectedJavaScriptObject

将任何JavaScript对象注入到webview中，使其对页面上运行的JS可用。

类型 必需 平台
对象 否 Android仅支持

示例

设置一个用于JavaScript的值。

注意：对象中的任何值都将对所有网页的所有框架可用。如果存在敏感值，请确保您已设置严格的内容安全策略，以避免数据泄露。

您可以使用 window.ReactNativeWebView.injectedObject 在webview中访问该对象。

window.ReactNativeWebView.injectedObjectJson();

mediaPlaybackRequiresUserAction

布尔值，用于确定HTML5音频和视频是否需要用户点击它们才开始播放。默认值是 true。 (Android API最低版本17)

注意：默认的 true 值可能会在iOS上导致某些视频在加载时挂起。将此值设置为 false 可能会解决这个问题。

类型 必需 平台
布尔型 否 iOS, Android

originWhitelist

允许导航到的源字符串列表。这些字符串允许通配符，并与仅源（而不是完整URL）进行匹配。如果用户点击以导航到新页面，但新页面不在白名单中，则URL将由操作系统处理。默认白名单源为 "http://" 和 "https://"。

类型 必需 平台
字符串数组 否 iOS, Android

scalesPageToFit

布尔值，用于控制是否将网页内容缩放到适合视图，并允许用户更改缩放比例。默认值是 true。

类型 必需 平台
布尔型 否 Android

decelerationRate

一个浮点数，用于确定用户抬起手指后滚动视图减速的速度。您还可以使用字符串快捷方式 "normal" 和 "fast"，分别匹配底层 iOS 设置 UIScrollViewDecelerationRateNormal 和 UIScrollViewDecelerationRateFast。

  • normal: 0.998
  • fast: 0.99（iOS Web View 的默认值）
类型 必需 平台
数字 否 iOS

domStorageEnabled

一个布尔值，用于控制是否启用 DOM 存储。仅用于 Android。

类型 必需 平台
布尔型 否 Android

javaScriptEnabled

一个布尔值，用于在 WebView 中启用 JavaScript。默认值为 true。

类型 必需
布尔型 否

javaScriptCanOpenWindowsAutomatically

一个布尔值，指示 JavaScript 是否可以在不与用户交互的情况下打开窗口。默认值为 false。

类型 必需
布尔型 否

androidLayerType

指定层类型。

androidLayerType 的可能值包括

  • none（默认）- 视图没有层。
  • software - 视图具有软件层。软件层由位图支持，即使启用了硬件加速，也会使用 Android 的软件渲染管道渲染视图。
  • hardware - 视图具有硬件层。硬件层由特定于硬件的纹理支持，只有当视图层次结构启用了硬件加速时，才会使用 Android 的硬件渲染管道渲染视图。
类型 必需 平台
字符串 否 Android

mixedContentMode

指定混合内容模式。即 WebView 允许安全来源加载来自任何其他来源的内容。

mixedContentMode 的可能值包括

  • never（默认）- WebView 不允许安全来源从非安全来源加载内容。
  • always - WebView 允许安全来源从任何其他来源加载内容，即使该来源是不安全的。
  • compatibility - WebView 将尝试与现代浏览器的混合内容方法保持一致。
类型 必需 平台
字符串 否 Android

thirdPartyCookiesEnabled

一个布尔值，用于在 WebView 中启用第三方 cookie。仅用于 Android Lollipop 及以上版本，因为在 Android KitKat 及以下版本和 iOS 中，第三方 cookie 默认已启用。默认值为 true。有关 cookie 的更多信息，请参阅指南。

类型 必需 平台
布尔型 否 Android

userAgent

为 WebView 设置用户代理。

类型 必需 平台
字符串 否 iOS, Android

applicationNameForUserAgent

追加到现有的用户代理。设置 userAgent 将覆盖此设置。

类型 必需 平台
字符串 否 iOS, Android

allowsFullscreenVideo

一个布尔值，用于确定是否允许在全屏中播放视频。默认值为 false。

类型 必需 平台
布尔型 否 Android

allowsInlineMediaPlayback

一个布尔值，用于确定 HTML5 视频是内联播放还是使用原生全屏控制器播放。默认值为 false。

注意

为了在行内播放视频，不仅需要将此属性设置为 true，HTML 文档中的视频元素还必须包含 webkit-playsinline 属性。

类型 必需 平台
布尔型 否 iOS

allowsAirPlayForMediaPlayback

一个布尔值，指示是否允许 AirPlay。默认值为 false。

类型 必需 平台
布尔值 否 iOS

bounces

一个布尔值，用于确定当视图达到内容边缘时是否反弹。默认值为 true。

类型 必需 平台
布尔型 否 iOS

overScrollMode

指定滚动模式。

overScrollMode 的可能值包括

  • always（默认）- 如果视图可以滚动，则始终允许用户超出滚动此视图。
  • content - 如果视图可以滚动，并且内容足够大，可以有意义地滚动，则允许用户超出滚动此视图。
  • never - 永不允许用户超出滚动此视图。
类型 必需 平台
字符串 否 Android

contentInset

WebView 内容与滚动视图边缘之间的距离。默认为 {top: 0, left: 0, bottom: 0, right: 0}。

类型 必需 平台
对象: {top: number, left: number, bottom: number, right: number} 否 iOS

contentInsetAdjustmentBehavior

此属性指定了如何使用安全区域内边距来修改滚动视图的内容区域。此属性的默认值为 "从不"。适用于 iOS 11 及更高版本。默认为 从不。

可能的值

  • 自动
  • scrollableAxes
  • 从不
  • 总是
类型 必需 平台
字符串 否 iOS

contentMode

控制要加载的内容类型。适用于 iOS 13 及更高版本。默认为 推荐，在 iPhone 和 iPad Mini 上加载移动内容，但在较大尺寸的 iPad 上加载桌面内容。

更多信息请参阅 在 iPad 上引入桌面级浏览。

可能的值

  • 推荐
  • 移动
  • 桌面
类型 必需 平台
字符串 否 iOS

dataDetectorTypes

确定在网页内容中转换为可点击 URL 的数据类型。默认情况下，仅检测电话号码。

您可以提供一个类型或多个类型的数组。

dataDetectorTypes 的可能值包括

  • 电话号码
  • 链接
  • 地址
  • 日历事件
  • 无
  • 所有
  • 跟踪号码
  • 航班号码
  • 查找建议
类型 必需 平台
字符串或数组 否 iOS

scrollEnabled

一个布尔值，用于确定是否在 WebView 中启用滚动。默认值为 true。将此设置为 false 将防止当键盘覆盖输入时，webview 移动文档体。

类型 必需 平台
布尔型 否 iOS

nestedScrollEnabled

一个布尔值，用于确定在 Android 中使用 ScrollView 内部的 WebView 时是否可以滚动。默认值为 false。将此设置为 true 将防止 ScrollView 在从 WebView 内部滚动时滚动。

设置此属性为 true 将防止 ScrollView 在从 WebView 内部滚动时滚动。

类型 必需 平台
布尔型 否 Android

setBuiltInZoomControls

设置 WebView 是否应使用其内置的缩放机制。默认值为 true。将此设置为 false 将防止使用捏合手势来控制缩放。

类型 必需 平台
布尔型 否 Android

setDisplayZoomControls

设置 WebView 是否应在使用内置缩放机制时显示屏幕缩放控件（请参阅 setBuiltInZoomControls）。默认值为 false。

类型 必需 平台
布尔型 否 Android

directionalLockEnabled

一个布尔值，用于确定是否禁用特定方向的滚动。默认值为 true。

类型 必需 平台
布尔型 否 iOS

showsHorizontalScrollIndicator

一个布尔值，用于确定是否在 WebView 中显示水平滚动指示器。默认值为 true。

类型 必需 平台
布尔型 否 iOS, Android

showsVerticalScrollIndicator

一个布尔值，用于确定是否在 WebView 中显示垂直滚动指示器。默认值为 true。

类型 必需 平台
布尔型 否 iOS, Android

geolocationEnabled

设置是否在 WebView 中启用地理位置。默认值为 false。仅在 Android 中使用。

类型 必需 平台
布尔型 否 Android

allowFileAccessFromFileURLs

一个布尔值，用于设置在文件方案 URL 的上下文中运行的 JavaScript 是否应被允许访问来自其他文件方案 URL 的内容。默认值为 false。

类型 必需 平台
布尔型 否 iOS, Android

allowUniversalAccessFromFileURLs

一个布尔值，用于设置在文件方案 URL 的上下文中运行的 JavaScript 是否应被允许访问来自任何来源的内容，包括从其他文件方案 URL 访问内容。默认值为 false。

类型 必需 平台
布尔型 否 iOS, Android

allowingReadAccessToURL

一个字符串值，指示 WebView 的文件可以在脚本、AJAX 请求和 CSS 导入中引用哪些 URL。这仅用于将 source.uri 设置为 'file://' URL 加载的 WebView。如果没有提供，默认情况下仅允许对在 source.uri 中提供的 URL 进行读取访问。

类型 必需 平台
字符串 否 iOS

keyboardDisplayRequiresUserAction

如果 false，则可以程序化地显示键盘。默认值为 true。

类型 必需 平台
布尔值 否 iOS

hideKeyboardAccessoryView

如果 true，则将隐藏键盘辅助视图（< > 和完成）。

类型 必需 平台
布尔值 否 iOS

allowsBackForwardNavigationGestures

如果 true，则可以水平滑动手势。默认值为 false。

类型 必需 平台
布尔值 否 iOS

incognito

在 WebView 的生命周期内不存储任何数据。

类型 必需 平台
布尔值 否 iOS, Android

allowFileAccess

如果设置为true，这将允许通过file:// URI访问文件系统。默认值是false。

类型 必需 平台
布尔值 否 Android

saveFormDataDisabled

设置WebView是否应禁用保存表单数据。默认值是false。从Android API 26开始，此函数没有效果，因为有一个自动填充功能可以存储表单数据。

类型 必需 平台
布尔值 否 Android

cacheEnabled

设置WebView是否应使用浏览器缓存。

类型 必需 默认 平台
布尔值 否 true iOS, Android

cacheMode

覆盖缓存的使用方式。缓存的使用方式基于导航类型。对于普通页面加载，缓存被检查，内容根据需要重新验证。在返回导航时，内容不会被重新验证，而是直接从缓存中检索内容。此属性允许客户端覆盖此行为。

可能的值包括

  • LOAD_DEFAULT - 默认缓存使用模式。如果导航类型不强制特定行为，则在可用且未过期时使用缓存资源，否则从网络加载资源。
  • LOAD_CACHE_ELSE_NETWORK - 在可用时使用缓存资源，即使它们已过期。否则从网络加载资源。
  • LOAD_NO_CACHE - 不使用缓存，从网络加载。
  • LOAD_CACHE_ONLY - 不使用网络，从缓存加载。
类型 必需 默认 平台
字符串 否 LOAD_DEFAULT Android

pagingEnabled

如果此属性的值为true，则当用户滚动时，滚动视图会在滚动视图边界的倍数处停止。默认值是false。

类型 必需 平台
布尔值 否 iOS

allowsLinkPreview

一个布尔值，用于确定是否在按下链接时显示链接目标的预览。在iOS上，此属性在支持3D Touch的设备上可用。在iOS 10及以后版本中，默认值是true；在此之前，默认值是false。

类型 必需 平台
布尔值 否 iOS

sharedCookiesEnabled

如果应使用来自[NSHTTPCookieStorage sharedHTTPCookieStorage]的共享cookie，则设置true。默认值是false。有关cookie的更多信息，请参阅指南

类型 必需 平台
布尔值 否 iOS

textZoom

如果用户在Android系统中设置了自定义字体大小，WebView中网站界面的缩放比例可能不理想。

设置标准文本缩放（100）参数大小时，这种不理想的效果会消失。

类型 必需 平台
数字 否 Android

pullToRefreshEnabled

一个布尔值，用于确定是否在WebView中提供下拉刷新手势。默认值是false。如果true，则自动将bounces设置为true。

类型 必需 平台
布尔值 否 iOS

ignoreSilentHardwareSwitch

(仅限iOS)

当设置为true时，将忽略硬件静音开关。默认：false

类型 必需 平台
布尔值 否 iOS

limitsNavigationsToAppBoundDomains

如果设置为true，表示WebKit将只会导航到与应用程序相关的域。仅适用于iOS 14或更高版本。

设置后，任何尝试导航离开与应用程序相关的域的尝试都将失败，错误信息为“应用程序相关域失败”。应用程序可以使用新的Info.plist密钥WKAppBoundDomains指定最多10个“应用程序相关”域。有关更多信息，请参阅应用程序相关域。

类型 必需 平台
布尔值 否 iOS

textInteractionEnabled

如果为false，表示WebKit不会与文本交互，因此不会显示文本选择循环。仅适用于iOS 14.5或更高版本。

默认为true。

类型 必需 平台
布尔值 否 iOS

suppressMenuItems

允许从默认上下文菜单中抑制菜单项。

可能的值包括

  • 剪切
  • 复制
  • 粘贴
  • 删除
  • 选择
  • 全选
  • 替换
  • 查找
  • 翻译
  • 粗体
  • 斜体
  • 下划线
  • 分享
类型 必需 默认 平台
字符串数组 否 [] iOS

mediaCapturePermissionGrantType

此属性指定如何处理媒体捕获权限请求。默认为prompt，这意味着用户会反复被提示。适用于iOS 15及更高版本。

可能的值

  • grantIfSameHostElsePrompt：如果权限请求的安全源主机与WebView当前URL的主机相同，并且之前已经授予了权限，则权限被授予。否则，用户会收到提示。
  • grantIfSameHostElseDeny：如果权限请求的安全源主机与WebView当前URL的主机相同，并且之前已经授予了权限，则权限被授予。否则，它被拒绝。
  • 拒绝
  • grant：如果之前已经授予了权限，则权限被授予。
  • 提示

请注意，即使如此，授予也可能导致提示，例如，如果用户以前从未被提示过此权限。

类型 必需 平台
字符串 否 iOS

autoManageStatusBarEnabled

如果设置为true，WebView将自动隐藏/显示状态栏，特别是在全屏观看视频时。如果设置为false，WebView将完全不会管理状态栏。默认值是true。

类型 必需 平台
布尔值 否 iOS

setSupportMultipleWindows

设置WebView是否支持多个窗口。有关更多信息，请参阅Android文档。将此设置为false可能会使应用程序容易受到此漏洞的影响，允许恶意iframe逃逸到顶层DOM。

类型 必需 默认 平台
布尔值 否 true Android

enableApplePay

一个布尔值，当设置为true时，WebView将带有Apple Pay支持进行渲染。一旦设置，网站将能够从React Native Webview调用Apple Pay。这带来了成本功能，如injectJavaScript、html5历史记录、sharedCookiesEnabled、injectedJavaScript、injectedJavaScriptBeforeContentLoaded将不会工作。请参阅Apple Pay发布说明。

如果您需要向App发送消息，网页必须显式调用webkit消息处理程序，并在React Native侧的onMessage处理程序中接收它。

window.webkit.messageHandlers.ReactNativeWebView.postMessage('hello apple pay');
类型 必需 默认 平台
布尔值 否 false iOS

forceDarkOn

配置深色主题

注意：强制深色设置不是持久的。您必须在每次应用程序进程启动时调用静态方法。

注意：从日间/夜间模式的变化是一个配置更改，因此默认情况下，活动将重新启动并拾取新值以应用主题。在覆盖此默认行为时，请注意确保在更改时仍然调用此方法。

类型 必需 平台
布尔值 否 Android

menuItems

一个当选择文本时要显示的自定义菜单项对象数组。空数组将抑制菜单。与onCustomMenuSelection一起使用。

类型 必需 平台
对象数组：{label: string, key: string} 否 iOS, Android

customMenuSelection

当选择自定义菜单项时调用的函数。它接收一个本地事件，该事件包括三个自定义键：label、key和selectedText。

类型 必需 平台
函数 否 iOS, Android

basicAuthCredential

一个指定用于基本身份验证的用户凭据的对象。

  • username（字符串）- 用于基本身份验证的用户名。
  • password（字符串）- 用于基本身份验证的密码。
类型 必需
对象 否

minimumFontSize

Android根据此值强制执行最小字体大小。一个介于1和72之间的非负整数。任何超出指定范围的数字都将被固定。默认值为8。如果您正在使用较小的字体大小并且难以将整个窗口 fit 在一个屏幕上，请尝试将此设置为更小的值。

类型 必需 平台
数字 否 Android

示例

<WebView minimumFontSize={1} />

downloadingMessage

这是通过WebView下载文件时在Toast中显示的消息。默认消息是“正在下载”。

类型 必需 平台
字符串 否 Android

lackPermissionToDownloadMessage

这是当WebView无法下载文件时Toast中显示的消息。默认消息是“无法下载文件，因为权限被拒绝。请提供写入存储的权限，以便下载文件。”。

类型 必需 平台
字符串 否 Android

allowsProtectedMedia

是否允许WebView播放受DRM保护的媒体。默认为false。⚠️将此设置为false不会撤销已授予当前网页的权限。为了做到这一点，您还必须重新加载页面。⚠️

类型 必需 平台
布尔值 否 Android

fraudulentWebsiteWarningEnabled

一个布尔值，表示WebView是否显示对疑似欺诈内容的警告，如恶意软件或钓鱼尝试。默认值是true。（iOS 13+）

类型 必需 默认 平台
布尔值 否 true iOS

webviewDebuggingEnabled

是否可以使用Safari/Chrome远程调试WebView。默认为false。从iOS 16.4开始支持，旧版本默认始终允许调试。

类型 必需 平台
布尔值 否 iOS & Android

事件

error

当WebView加载失败时触发的事件。

类型 必需
事件 否

error事件使用具有以下属性的event.nativeEvent调用

canGoBack
canGoForward
code
description
didFailProvisionalNavigation
domain
loading
target
title
url

load

当WebView完成加载时触发的事件。

类型 必需
事件 否

load事件使用具有以下属性的event.nativeEvent调用

canGoBack
canGoForward
loading
target
title
url

loadEnd

当WebView加载成功或失败时触发的事件。

类型 必需
事件 否

loadEnd事件使用具有以下属性的event.nativeEvent调用

canGoBack
canGoForward
loading
target
title
url

loadingStart

当WebView开始加载时触发的事件。

类型 必需
事件 否

loadingStart事件使用具有以下属性的event.nativeEvent调用

canGoBack
canGoForward
loading
target
title
url

loadingProgress

当WebView正在加载时触发的事件。

类型 必需 平台
事件 否 iOS, Android

loadingProgress事件使用具有以下属性的event.nativeEvent调用

canGoBack
canGoForward
loading
progress
target
title
url

httpError

当WebView收到http错误时触发的事件。

注意 Android API最小级别23。

类型 必需
事件 否

httpError事件使用具有以下属性的event.nativeEvent调用

canGoBack
canGoForward
description
loading
statusCode
target
title
url

注意 描述仅在Android上使用

renderProcessGone

当WebView进程在Android上崩溃或被操作系统杀死时触发的事件。

注意 Android API最小级别26。仅限Android

类型 必需
事件 否

renderProcressGone事件使用具有以下属性的event.nativeEvent调用

didCrash

message

当WebView调用window.ReactNativeWebView.postMessage时触发的事件。设置此属性将在您的WebView中注入此全局变量。

window.ReactNativeWebView.postMessage接受一个参数data，它将在事件对象event.nativeEvent.data中可用。data必须是一个字符串。

类型 必需
事件 否

navigationStateChange

当WebView开始或结束加载时触发的事件。

类型 必需
事件 否

navigationStateChange事件使用以下属性调用

canGoBack
canGoForward
loading
navigationType (iOS only)
target
title
url

openWindow

当WebView应该打开新窗口时触发的事件。

当JS调用window.open('http://someurl', '_blank')或用户点击<a href="http://someurl" target="_blank">链接时，会发生这种情况。

类型 必需
事件 否

openWindow事件使用具有以下属性的event.nativeEvent调用

targetUrl

contentProcessDidTerminate

当WebView内容进程被终止时触发的事件。

类型 必需 平台
事件 否 iOS

iOS WebView使用单独的进程来渲染和管理网页内容。WebKit在指定的WebView的进程因任何原因终止时调用此方法。原因不一定是崩溃。例如，由于iOS WebView不包括在应用的总RAM中，它们可以独立于应用被终止以为新应用释放内存。在后台运行一段时间后WebView被终止并不意外。

当调用 contentProcessDidTerminate 事件时，会使用包含以下属性的 event.nativeEvent

canGoBack
canGoForward
loading
target
title
url

滚动

在 WebView 中触发滚动事件时调用的事件。

类型 必需 平台
事件 否 iOS, Android

使用包含以下属性的 event.nativeEvent 调用 scroll 事件。

contentInset
contentOffset
contentSize
layoutMeasurement
velocity
zoomScale

shouldStartLoad

允许自定义处理任何 WebView 请求的事件。从函数中设置 event.nativeEvent.shouldStart = true 以继续加载请求，或设置为 false 以停止加载。

在 Android 上，第一次加载时不会调用。

类型 必需 平台
事件 否 iOS, Android

event.nativeEvent 对象包含以下属性

title
url
loading
target
canGoBack
canGoForward
lockIdentifier
mainDocumentURL (iOS only)
navigationType (iOS only)
isTopFrame (iOS only)
hasTargetFrame (iOS only)
shouldStart

hasTargetFrame 属性是一个布尔值，当导航指向新的窗口或标签页时为 false，否则应为 true （更多信息请参阅 此处）。请注意，当在 WebView 上注册 onOpenWindow 事件时，此属性始终应为 true，因为 false 的情况已被此事件拦截。

文件下载

此属性仅适用于 iOS。

当客户端需要下载文件时调用的函数。

iOS 13+：如果 WebView 导航到导致带有 'attachment...' Content-Disposition 头的 HTTP 响应的 URL，则会调用此函数。

iOS 8+：如果 MIME 类型指示内容无法由 WebView 渲染，这也会导致调用此函数。在 iOS 13 之前的版本中，这是唯一会导致调用此函数的条件。

应用程序需要提供自己的代码来实际下载文件。

如果没有提供，默认情况下允许 WebView 尝试渲染文件。

类型 必需 平台
事件 否 iOS

方法

goForward()

goForward();

在 WebView 的历史记录中向前翻一页。

goBack()

goBack();

在 WebView 的历史记录中向后翻一页。

reload()

reload();

重新加载当前页面。

stopLoading()

stopLoading();

停止加载当前页面。

injectJavaScript(str)

injectJavaScript('... javascript string ...');

执行 JavaScript 字符串。

要了解更多信息，请阅读JS与原生通信指南。

requestFocus()

requestFocus();

请求 webView 请求焦点。（正在为 TV 应用程序工作的人可能想看看这个！）

postMessage(str)

postMessage('message');

向 WebView 发送消息，由 onMessage 处理。

clearFormData()

（仅限 Android）

clearFormData();

如果存在，则从当前聚焦的表单字段中删除自动完成弹出窗口。请参阅 developer.android.com 参考

clearCache(bool)

clearCache(true);

清除资源缓存。请注意，缓存是按应用程序划分的，因此这将清除所有 WebView 所使用的缓存。请参阅 developer.android.com 参考

在 iOS 中，includeDiskFiles 还会从网络存储和数据库中删除数据。developer.apple.com 参考

clearHistory()

（仅限 Android）

clearHistory();

许可

Apache 许可证版本 2.0