@react-native-ohos/react-native-webview 13.10.5-rc.6 → 13.10.6-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +387 -7
- package/harmony/rn_webview/BuildProfile.ets +16 -40
- package/harmony/rn_webview/oh-package-lock.json5 +19 -0
- package/harmony/rn_webview/oh-package.json5 +1 -1
- package/harmony/rn_webview/src/main/ets/Magic.ets +15 -0
- package/harmony/rn_webview/src/main/ets/RNCWebView.ets +174 -42
- package/harmony/rn_webview/src/main/ets/WebViewBaseOperate.ets +13 -0
- package/harmony/rn_webview.har +0 -0
- package/package.json +3 -3
- package/src/WebView.harmony.tsx +1 -1
package/README.md
CHANGED
|
@@ -1,13 +1,393 @@
|
|
|
1
|
-
|
|
1
|
+
> 模板版本：v0.4.0
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
<p align="center">
|
|
4
|
+
<h1 align="center"> <code>react-native-webview</code> </h1>
|
|
5
|
+
</p>
|
|
6
|
+
<p align="center">
|
|
7
|
+
<a href="https://github.com/react-native-webview/react-native-webview">
|
|
8
|
+
<img src="https://img.shields.io/badge/platforms-android%20%7C%20ios%20%7C%20windows%20%7C%20macos%20%7C%20harmony%20-lightgrey.svg" alt="Supported platforms" />
|
|
9
|
+
</a>
|
|
10
|
+
<a href="https://github.com/react-native-webview/react-native-webview/blob/master/LICENSE">
|
|
11
|
+
<img src="https://img.shields.io/badge/license-MIT-green.svg" alt="License" />
|
|
12
|
+
</a>
|
|
13
|
+
</p>
|
|
4
14
|
|
|
5
|
-
|
|
15
|
+
> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-webview)
|
|
6
16
|
|
|
7
|
-
|
|
17
|
+
## 安装与使用
|
|
8
18
|
|
|
9
|
-
|
|
19
|
+
请到三方库的 Releases 发布地址查看配套的版本信息：
|
|
10
20
|
|
|
11
|
-
|
|
21
|
+
| 三方库名称 | 三方库版本 | 发布信息 | 支持RN版本 | Autolink | 编译API版本 | 社区基线版本 | npm地址
|
|
22
|
+
| ------------ |---------|---------------------------------------------------------------------------------------------|----------------------|--------------------|-------------------|----------------------------|----------------------------------|
|
|
23
|
+
|@react-native-ohos/react-native-webview| ~13.16.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-webview/releases) | 0.82.* | 否 | API20+ | 13.16.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-webview)|
|
|
24
|
+
|@react-native-ohos/react-native-webview| ~13.15.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-webview/releases) | 0.77.* | 否 | API20+ | 13.15.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-webview)|
|
|
25
|
+
|@react-native-ohos/react-native-webview| ~13.10.5 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-webview/releases) | 0.72.* | 是 |API20+ | 13.10.2 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-webview)|
|
|
26
|
+
|@react-native-oh-tpl/react-native-webview| <=13.10.4@deprecated | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-webview/releases) | 0.72.* | 否 | API12+ | 13.10.2 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-webview) |
|
|
27
|
+
|
|
28
|
+
对于未发布到npm的旧版本，请参考[安装指南](/tgz-usage.md)安装tgz包。
|
|
29
|
+
|
|
30
|
+
进入到工程目录并输入以下命令：
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
<!-- tabs:start -->
|
|
34
|
+
|
|
35
|
+
#### **npm**
|
|
36
|
+
|
|
37
|
+
```bash
|
|
38
|
+
npm install @react-native-ohos/react-native-webview
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
#### **yarn**
|
|
42
|
+
|
|
43
|
+
```bash
|
|
44
|
+
yarn add @react-native-ohos/react-native-webview
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
<!-- tabs:end -->
|
|
48
|
+
|
|
49
|
+
下面的代码展示了这个库的基本使用场景：
|
|
50
|
+
|
|
51
|
+
> [!WARNING] 使用时 import 的库名不变。
|
|
52
|
+
|
|
53
|
+
```js
|
|
54
|
+
import { WebView } from "react-native-webview";
|
|
55
|
+
|
|
56
|
+
export default function WebViewDemo() {
|
|
57
|
+
return (
|
|
58
|
+
<WebView source={{ uri: "https://reactnative.dev/" }} />
|
|
59
|
+
);
|
|
60
|
+
}
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
## Link
|
|
64
|
+
|
|
65
|
+
| | Is supported autolink | Supported RN Version |
|
|
66
|
+
|--------------------------------------|-----------------------|----------------------|
|
|
67
|
+
| ~13.16.1 | No | 0.82 |
|
|
68
|
+
| ~13.15.1 | No | 0.77 |
|
|
69
|
+
| ~13.10.5 | Yes | 0.72 |
|
|
70
|
+
| <= 13.10.4@deprecated | No | 0.72 |
|
|
71
|
+
|
|
72
|
+
使用AutoLink的工程需要根据该文档配置，Autolink框架指导文档：https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md
|
|
73
|
+
|
|
74
|
+
如您使用的版本支持 Autolink，并且工程已接入 Autolink，可跳过ManualLink配置。
|
|
75
|
+
<details>
|
|
76
|
+
<summary>ManualLink: 此步骤为手动配置原生依赖项的指导</summary>
|
|
77
|
+
|
|
78
|
+
首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony`
|
|
79
|
+
|
|
80
|
+
### 1.在工程根目录的 `oh-package.json5` 添加 overrides 字段
|
|
81
|
+
|
|
82
|
+
```json
|
|
83
|
+
{
|
|
84
|
+
...
|
|
85
|
+
"overrides": {
|
|
86
|
+
"@rnoh/react-native-openharmony" : "./react_native_openharmony"
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
### 2.引入原生端代码
|
|
92
|
+
|
|
93
|
+
目前有两种方法：
|
|
94
|
+
|
|
95
|
+
1. 通过 har 包引入（在 IDE 完善相关功能后该方法会被遗弃，目前首选此方法）；
|
|
96
|
+
2. 直接链接源码。
|
|
97
|
+
|
|
98
|
+
方法一：通过 har 包引入
|
|
99
|
+
|
|
100
|
+
> [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。
|
|
101
|
+
|
|
102
|
+
打开 `entry/oh-package.json5`，添加以下依赖
|
|
103
|
+
|
|
104
|
+
```json
|
|
105
|
+
"dependencies": {
|
|
106
|
+
"@rnoh/react-native-openharmony": "file:../react_native_openharmony",
|
|
107
|
+
|
|
108
|
+
"@react-native-ohos/react-native-webview": "file:../../node_modules/@react-native-ohos/react-native-webview/harmony/rn_webview.har"
|
|
109
|
+
}
|
|
110
|
+
```
|
|
111
|
+
|
|
112
|
+
点击右上角的 `sync` 按钮
|
|
113
|
+
|
|
114
|
+
或者在终端执行：
|
|
115
|
+
|
|
116
|
+
```bash
|
|
117
|
+
cd entry
|
|
118
|
+
ohpm install
|
|
119
|
+
```
|
|
120
|
+
|
|
121
|
+
方法二：直接链接源码
|
|
122
|
+
|
|
123
|
+
> [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/link-source-code.md)
|
|
124
|
+
|
|
125
|
+
### 3.配置 CMakeLists 和引入 WebViewPackage
|
|
126
|
+
|
|
127
|
+
打开 `entry/src/main/cpp/CMakeLists.txt`，添加：
|
|
128
|
+
|
|
129
|
+
```diff
|
|
130
|
+
project(rnapp)
|
|
131
|
+
cmake_minimum_required(VERSION 3.4.1)
|
|
132
|
+
set(CMAKE_SKIP_BUILD_RPATH TRUE)
|
|
133
|
+
set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}")
|
|
134
|
+
set(NODE_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../node_modules")
|
|
135
|
+
set(OH_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules")
|
|
136
|
+
+set(OH_MODULE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules")
|
|
137
|
+
set(RNOH_CPP_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../../react-native-harmony/harmony/cpp")
|
|
138
|
+
set(LOG_VERBOSITY_LEVEL 1)
|
|
139
|
+
set(CMAKE_ASM_FLAGS "-Wno-error=unused-command-line-argument -Qunused-arguments")
|
|
140
|
+
set(CMAKE_CXX_FLAGS "-fstack-protector-strong -Wl,-z,relro,-z,now,-z,noexecstack -s -fPIE -pie")
|
|
141
|
+
set(WITH_HITRACE_SYSTRACE 1) # for other CMakeLists.txt files to use
|
|
142
|
+
add_compile_definitions(WITH_HITRACE_SYSTRACE)
|
|
143
|
+
|
|
144
|
+
add_subdirectory("${RNOH_CPP_DIR}" ./rn)
|
|
145
|
+
|
|
146
|
+
# RNOH_BEGIN: manual_package_linking_1
|
|
147
|
+
add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
|
|
148
|
+
+ add_subdirectory("${OH_MODULE_DIR}/@react-native-ohos/react-native-webview/src/main/cpp" ./webview)
|
|
149
|
+
|
|
150
|
+
# RNOH_END: manual_package_linking_1
|
|
151
|
+
|
|
152
|
+
file(GLOB GENERATED_CPP_FILES "./generated/*.cpp")
|
|
153
|
+
|
|
154
|
+
add_library(rnoh_app SHARED
|
|
155
|
+
${GENERATED_CPP_FILES}
|
|
156
|
+
"./PackageProvider.cpp"
|
|
157
|
+
"${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp"
|
|
158
|
+
)
|
|
159
|
+
target_link_libraries(rnoh_app PUBLIC rnoh)
|
|
160
|
+
|
|
161
|
+
# RNOH_BEGIN: manual_package_linking_2
|
|
162
|
+
target_link_libraries(rnoh_app PUBLIC rnoh_sample_package)
|
|
163
|
+
+ target_link_libraries(rnoh_app PUBLIC rnoh_webview)
|
|
164
|
+
# RNOH_END: manual_package_linking_2
|
|
165
|
+
```
|
|
166
|
+
|
|
167
|
+
打开 `entry/src/main/cpp/PackageProvider.cpp`，添加：
|
|
168
|
+
|
|
169
|
+
```diff
|
|
170
|
+
#include "RNOH/PackageProvider.h"
|
|
171
|
+
#include "SamplePackage.h"
|
|
172
|
+
+ #include "WebViewPackage.h"
|
|
173
|
+
|
|
174
|
+
using namespace rnoh;
|
|
175
|
+
|
|
176
|
+
std::vector<std::shared_ptr<Package>> PackageProvider::getPackages(Package::Context ctx) {
|
|
177
|
+
return {
|
|
178
|
+
std::make_shared<SamplePackage>(ctx),
|
|
179
|
+
+ std::make_shared<WebViewPackage>(ctx)
|
|
180
|
+
};
|
|
181
|
+
}
|
|
182
|
+
```
|
|
183
|
+
|
|
184
|
+
### 4.在 ArkTs 侧引入 webview 组件
|
|
185
|
+
|
|
186
|
+
找到 **function buildCustomComponent()**，一般位于 `entry/src/main/ets/pages/index.ets` 或 `entry/src/main/ets/rn/LoadBundle.ets`，添加：
|
|
187
|
+
|
|
188
|
+
```diff
|
|
189
|
+
+ import { WebView, WEB_VIEW } from "@react-native-ohos/react-native-webview"
|
|
190
|
+
|
|
191
|
+
@Builder
|
|
192
|
+
function buildCustomComponent(ctx: ComponentBuilderContext) {
|
|
193
|
+
+ if (ctx.componentName === WEB_VIEW) {
|
|
194
|
+
+ WebView({
|
|
195
|
+
+ ctx: ctx.rnComponentContext,
|
|
196
|
+
+ tag: ctx.tag
|
|
197
|
+
+ })
|
|
198
|
+
+ }
|
|
199
|
+
...
|
|
200
|
+
}
|
|
201
|
+
...
|
|
202
|
+
```
|
|
203
|
+
|
|
204
|
+
> [!TIP] 本库使用了混合方案，需要添加组件名。
|
|
205
|
+
|
|
206
|
+
在`entry/src/main/ets/pages/index.ets` 或 `entry/src/main/ets/rn/LoadBundle.ets` 找到常量 `arkTsComponentNames` 在其数组里添加组件名
|
|
207
|
+
|
|
208
|
+
```diff
|
|
209
|
+
const arkTsComponentNames: Array<string> = [
|
|
210
|
+
SampleView.NAME,
|
|
211
|
+
GeneratedSampleView.NAME,
|
|
212
|
+
PropsDisplayer.NAME,
|
|
213
|
+
+ WEB_VIEW
|
|
214
|
+
];
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
### 5.在 ArkTs 侧引入 WebViewPackage
|
|
218
|
+
|
|
219
|
+
打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加：
|
|
220
|
+
|
|
221
|
+
```diff
|
|
222
|
+
import type {RNPackageContext, RNPackage} from 'rnoh/ts';
|
|
223
|
+
import {SamplePackage} from 'rnoh-sample-package/ts';
|
|
224
|
+
+ import { WebViewPackage } from '@react-native-ohos/react-native-webview/ts';
|
|
225
|
+
|
|
226
|
+
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
|
|
227
|
+
return [
|
|
228
|
+
new SamplePackage(ctx),
|
|
229
|
+
+ new WebViewPackage(ctx)
|
|
230
|
+
];
|
|
231
|
+
}
|
|
232
|
+
```
|
|
233
|
+
</details>
|
|
234
|
+
|
|
235
|
+
## 运行
|
|
236
|
+
|
|
237
|
+
点击右上角的 `sync` 按钮
|
|
238
|
+
|
|
239
|
+
或者在终端执行：
|
|
240
|
+
|
|
241
|
+
```bash
|
|
242
|
+
cd entry
|
|
243
|
+
ohpm install
|
|
244
|
+
```
|
|
245
|
+
|
|
246
|
+
然后编译、运行即可。
|
|
247
|
+
|
|
248
|
+
## 约束与限制
|
|
249
|
+
|
|
250
|
+
### 兼容性
|
|
251
|
+
|
|
252
|
+
要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。
|
|
253
|
+
|
|
254
|
+
在以下版本验证通过：
|
|
255
|
+
|
|
256
|
+
1. RNOH: 0.72.96; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112;
|
|
257
|
+
2. RNOH: 0.72.33; SDK: HarmonyOS NEXT B1; IDE: DevEco Studio: 5.0.3.900; ROM: Next.0.0.71;
|
|
258
|
+
3. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112;
|
|
259
|
+
4. RNOH: 0.82.1; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112;
|
|
260
|
+
|
|
261
|
+
## 属性
|
|
262
|
+
> [!WARNING]ignoreSilentHardwareSwitch需要设置true网页播放才有声音
|
|
263
|
+
|
|
264
|
+
> [!TIP] "Platform"列表示该属性在原三方库上支持的平台。
|
|
265
|
+
|
|
266
|
+
> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。
|
|
267
|
+
|
|
268
|
+
详情请查看[webview 官方文档](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md)
|
|
269
|
+
|
|
270
|
+
| Name | Description | Type | Required | Platform | HarmonyOS Support |
|
|
271
|
+
|----------------------------------------------------------| ------------------------------------------------------------ | -------- |----------|---------------------|------------------------------------------------------------------------------------|
|
|
272
|
+
| `source` | Loads static HTML or a URI (with optional headers) in the WebView | object | yes | All | partially (Only of: **Load uri :** uri headers **Static HTML :** html baseUrl) |
|
|
273
|
+
| `ref` | Used to get a reference to a component instance | object | yes | All | yes |
|
|
274
|
+
| `injectedJavaScript?` | Set this to provide JavaScript that will be injected into the web page after the document finishes loading | string | No | All | yes |
|
|
275
|
+
| `originWhitelist?` | List of origin strings to allow being navigated to. | string[] | No | iOS,Android,macOS | No |
|
|
276
|
+
| `scalesPageToFit?` | Boolean that controls whether the web content is scaled to fit the view and enables the user to change the scale. | boolean | No | Android | yes |
|
|
277
|
+
| `startInLoadingState?` | Boolean value that forces the WebView to show the loading view on the first load. | boolean | No | iOS,Android,macOS | No |
|
|
278
|
+
| `style?` | A style object that allow you to customize the WebView style. | Style | No | ALL | yes |
|
|
279
|
+
| `domStorageEnabled?` | Boolean value to control whether DOM Storage is enabled. Used only in Android and harmony. | boolean | No | Android | yes |
|
|
280
|
+
| `javaScriptEnabled?` | Boolean value to enable JavaScript in the WebView. | boolean | No | All | yes |
|
|
281
|
+
| `showsHorizontalScrollIndicator?` | Boolean value that determines whether a horizontal scroll indicator is shown in the WebView. | boolean | No | iOS,Android,macOS | yes |
|
|
282
|
+
| `showsVerticalScrollIndicator` | Boolean value that determines whether a vertical scroll indicator is shown in the WebView. | boolean | No | iOS,Android,macOS | yes |
|
|
283
|
+
| `ignoreSilentHardwareSwitch` | Boolean value that When set to true the hardware silent switch is ignored. | boolean | No | iOS | yes |
|
|
284
|
+
| `cacheEnabled?` | Sets whether WebView should use browser caching. | boolean | No | iOS,Android,macOS | yes |
|
|
285
|
+
| `cacheMode?` | Overrides the way the cache is used. | string | No | Android | yes |
|
|
286
|
+
| `textZoom?` | If the user has set a custom font size in the Android and harmony system, an undesirable scale of the site interface in WebView occurs. | number | No | Android | yes |
|
|
287
|
+
| `incognito?` | Does not store any data within the lifetime of the WebView. | boolean | NO | All | yes |
|
|
288
|
+
| `mediaPlaybackRequiresUserAction?` | Boolean that determines whether HTML5 audio and video requires the user to tap them before they start playing. The default value is `true`. (Android API minimum version 17). | boolean | NO | iOS,Android,macOS | yes |
|
|
289
|
+
| `geolocationEnabled?` | Set whether Geolocation is enabled in the `WebView`. The default value is `false`. Used only in Android. | boolean | NO | Android | yes |
|
|
290
|
+
| `fraudulentWebsiteWarningEnabled?` | A Boolean value that indicates whether the web view shows warnings for suspected fraudulent content, such as malware or phishing attempts. The default value is `true`. (iOS 13+) | boolean | NO | iOS | yes (该接口不生效，调用不会产生任何实际效果,非法和欺诈网站是强制启用的，鸿蒙OS当前实现如此。) |
|
|
291
|
+
| `userAgent?` | Sets the user-agent for the `WebView`. | string | NO | iOS,Android,macOS | yes |
|
|
292
|
+
| `minimumFontSize?` | Android enforces a minimum font size based on this value. A non-negative integer between 1 and 72. Any number outside the specified range will be pinned. Default value is 8. If you are using smaller font sizes and are having trouble fitting the whole window onto one screen, try setting this to a smaller value. | number | No | Android | yes |
|
|
293
|
+
| `forceDarkOn?` | Configuring Dark Theme | boolean | No | Android | yes |
|
|
294
|
+
| `injectedJavaScriptBeforeContentLoaded?` | Set this to provide JavaScript that will be injected into the web page after the document element is created, but before other subresources finish loading. | string | No | iOS,Android,macOS | yes |
|
|
295
|
+
| `automaticallyAdjustContentInsets?` | Controls whether to adjust the content inset for web views that are placed behind a navigation bar, tab bar, or toolbar. The default value is `true` | boolean | No | iOS | No |
|
|
296
|
+
| `automaticallyAdjustsScrollIndicatorInsets?` | Controls whether to adjust the scroll indicator inset for web views that are placed behind a navigation bar, tab bar, or toolbar. The default value `false`. (iOS 13+) | boolean | No | iOS | No |
|
|
297
|
+
| `injectedJavaScriptBeforeContentLoadedForMainFrameOnly?` | If `true` (default; mandatory for Android), loads the `injectedJavaScriptBeforeContentLoaded` only into the main frame. | boolean | No | iOS | No |
|
|
298
|
+
| `nativeConfig?` | Override the native component used to render the WebView. Enables a custom native WebView which uses the same JavaScript as the original WebView. | object | No | iOS, Android, macOS | No |
|
|
299
|
+
| `decelerationRate?` | A floating-point number that determines how quickly the scroll view decelerates after the user lifts their finger. You may also use the string shortcuts `"normal"` and `"fast"` which match the underlying iOS | number | No | iOS | No |
|
|
300
|
+
| `javaScriptCanOpenWindowsAutomatically?` | A Boolean value indicating whether JavaScript can open windows without user interaction. The default value is `false`. | boolean | No | iOS, Android, macOS | No |
|
|
301
|
+
| `AndroidLayerType?` | Specifies the layer type. | string | No | Android | No |
|
|
302
|
+
| `mixedContentMode?` |Specifies the mixed content mode. i.e WebView will allow a secure origin to load content from any other origin. | string | No | Android | No |
|
|
303
|
+
| `allowsFullscreenVideo?` | Boolean that determines whether videos are allowed to be played in fullscreen. The default value is false. | boolean | NO | Android | NO |
|
|
304
|
+
| `allowsInlineMediaPlayback?` | Boolean that determines whether HTML5 videos play inline or use the native full-screen controller. The default value is `false`. | boolean | NO | iOS | NO |
|
|
305
|
+
| `allowsAirPlayForMediaPlayback?` | A Boolean value indicating whether AirPlay is allowed. The default value is `false`. | boolean | NO | iOS and macOS | NO |
|
|
306
|
+
| `contentInset?` | The amount by which the web view content is inset from the edges of the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}. | object | NO | iOS | NO |
|
|
307
|
+
| `contentInsetAdjustmentBehavior?` | This property specifies how the safe area insets are used to modify the content area of the scroll view. The default value of this property is "never". Available on iOS 11 and later. Defaults to `never`. | string | NO | iOS | NO |
|
|
308
|
+
| `contentMode?` | Controls the type of content to load. Available on iOS 13 and later. Defaults to `recommended`, which loads mobile content on iPhone & iPad Mini but desktop content on larger iPads. | string | No | iOS | NO |
|
|
309
|
+
| `dataDetectorTypes?` | Determines the types of data converted to clickable URLs in the web view's content. By default only phone numbers are detected. | string, or array | NO | ios | NO |
|
|
310
|
+
| `setBuiltInZoomControls?` | Sets whether the WebView should use its built-in zoom mechanisms. The default value is `true`. Setting this to `false` will prevent the use of a pinch gesture to control zooming. | boolean | NO | Android | NO |
|
|
311
|
+
| `setDisplayZoomControls?` | Sets whether the WebView should display on-screen zoom controls when using the built-in zoom mechanisms (see `setBuiltInZoomControls`). The default value is `false`. | boolean | NO | Android | NO |
|
|
312
|
+
| `directionalLockEnabled?` | A Boolean value that determines whether scrolling is disabled in a particular direction. The default value is `true`. | boolean | NO | iOS | NO |
|
|
313
|
+
| `allowFileAccessFromFileURLs?` | Boolean that sets whether JavaScript running in the context of a file scheme URL should be allowed to access content from other file scheme URLs. The default value is `false`. | boolean | NO | iOS, Android, macOS | NO |
|
|
314
|
+
| `allowUniversalAccessFromFileURLs?` | boolean | NO | No | iOS, Android, macOS | No |
|
|
315
|
+
| `allowingReadAccessToURL` | A String value that indicates which URLs the WebView's file can then reference in scripts, AJAX requests, and CSS imports. This is only used in for WebViews that are loaded with a `source.uri` set to a `'file://'` URL. If not provided, the default is to only allow read access to the URL provided in `source.uri` itself. | string | NO | iOS and macOS | NO |
|
|
316
|
+
| `keyboardDisplayRequiresUserAction?` | If `false`, web content can programmatically display the keyboard. The default value is `true`. | boolean | NO | iOS and macOS | NO |
|
|
317
|
+
| `hideKeyboardAccessoryView?` | If `true`, this will hide the keyboard accessory view (< > and Done). | boolean | NO | iOS | NO |
|
|
318
|
+
| `allowsBackForwardNavigationGestures?` | If `true`, this will be able horizontal swipe gestures. The default value is `false`. | boolean | NO | iOS | No |
|
|
319
|
+
| `allowFileAccess?` | If `true`, this will allow access to the file system via `file://` URI's. The default value is `false`. | boolean | NO | Android | NO |
|
|
320
|
+
| `saveFormDataDisabled?` | Sets whether the WebView should disable saving form data. The default value is `false`. This function does not have any effect from Android API level 26 onwards as there is an Autofill feature which stores form data. | boolean | NO | Android | NO |
|
|
321
|
+
| `pagingEnabled?` | If the value of this property is `true`, the scroll view stops on multiples of the scroll view’s bounds when the user scrolls. The default value is `false`. | boolean | NO | iOS | NO |
|
|
322
|
+
| `allowsLinkPreview?` | A Boolean value that determines whether pressing on a link displays a preview of the destination for the link. In iOS this property is available on devices that support 3D Touch. In iOS 10 and later, the default value is `true`; before that, the default value is `false` | boolean | NO | iOS and macOS | NO |
|
|
323
|
+
| `sharedCookiesEnabled?` | Set `true` if shared cookies from `[NSHTTPCookieStorage sharedHTTPCookieStorage]` should be used for every load request in the WebView. The default value is `false`. For more on cookies, read the [Guide](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#Managing-Cookies) | boolean | NO | iOS and macOS | NO |
|
|
324
|
+
| `limitsNavigationsToAppBoundDomains?` | If `true` indicates to WebKit that a WKWebView will only navigate to app-bound domains. Only applicable for iOS 14 or greater. | boolean | NO | iOS | No |
|
|
325
|
+
| `textInteractionEnabled?` | If false indicates to WebKit that a WKWebView will not interact with text, thus not showing a text selection loop. Only applicable for iOS 14.5 or greater. | boolean | NO | iOS | NO |
|
|
326
|
+
| `suppressMenuItems?` | Allows to suppress menu item from the default context menu. | array of strings | NO | iOS | NO |
|
|
327
|
+
| `mediaCapturePermissionGrantType?` | This property specifies how to handle media capture permission requests. Defaults to `prompt`, resulting in the user being prompted repeatedly. Available on iOS 15 and later. | string | NO | iOS | yes |
|
|
328
|
+
| `autoManageStatusBarEnabled?` | If set to `true`, the status bar will be automatically hidden/shown by WebView, specifically when full screen video is being watched. If `false`, WebView will not manage the status bar at all. The default value is `true`. | boolean | NO | iOS | NO |
|
|
329
|
+
| `basicAuthCredential`? | object that specifies the credentials of a user to be used for basic authentication. | object | NO | iOS, Android | NO |
|
|
330
|
+
| `useWebView2?` | Use WinUI WebView2 control instead of WebView control as the native webview. The WebView2 control is a WinUI control that renders web content using the Microsoft Edge (Chromium) rendering engine. Option can be toggled at runtime and supports Fast Refresh. | boolean | NO | Windows | NO |
|
|
331
|
+
| `applicationNameForUserAgent?` | Append to the existing user-agent. Setting `userAgent` will override this. | string | No | All | yes |
|
|
332
|
+
| `thirdPartyCookiesEnabled?` | Boolean value to enable third party cookies in the `WebView`. Used on Android Lollipop and above only as third party cookies are enabled by default on Android Kitkat and below and on iOS. The default value is `true`. | boolean | No | All | yes |
|
|
333
|
+
| `menuItems?` | An array of custom menu item objects that will be shown when selecting text. An empty array will suppress the menu | array of objects | No | iOS,Android | yes |
|
|
334
|
+
| `paymentRequestEnabled<sup>13.15.1+</sup>` | Whether or not the webview has the Payment Request API enabled.The default value is `false`. | boolean | No | Android | No |
|
|
335
|
+
| `allowsPictureInPictureMediaPlayback<sup>13.15.1+</sup>` | Boolean value that indicates whether HTML5 videos can play Picture in Picture.The default value is `false`. | boolean | No | Android | No |
|
|
336
|
+
| `refreshControlLightMode<sup>13.15.1+</sup>` | (ios only) Boolean value that determines whether the refresh control color is white or not.The default value is `false`. | boolean | No | iOS | No |
|
|
337
|
+
| `indicatorStyle <sup>13.15.1+</sup>` | The colorstyle of the scroll indicator. | string | No | iOS, Android | No |
|
|
338
|
+
|
|
339
|
+
## 事件回调
|
|
340
|
+
|
|
341
|
+
> [!TIP] "Platform"列表示该属性在原三方库上支持的平台。
|
|
342
|
+
|
|
343
|
+
> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。
|
|
344
|
+
|
|
345
|
+
| Name | Description | Type | Required | Platform | HarmonyOS Support |
|
|
346
|
+
|---------------------------------------------------------------| ------------------------------------------------------------ | -------- | -------- | ----------------------- |-------------------|
|
|
347
|
+
| `onScroll?: (event) => void` | Function that is invoked when the scroll event is fired in the `WebView`. | function | No | iOS and macOS | yes |
|
|
348
|
+
| `onHttpError?: (event) => void` | Function that is invoked when the `WebView` receives an http error. | function | No | yes | yes |
|
|
349
|
+
| `onLoadStart?: (event) => void` | Function that is invoked when the `WebView` starts loading. | function | No | All | yes |
|
|
350
|
+
| `onLoad?: (event) => void` | Function that is invoked when the `WebView` has finished loading. | function | No | All | yes |
|
|
351
|
+
| `onOpenWindow?` | Function that is invoked when the `WebView` should open a new window. | function | No | iOS, Android, macOS | No |
|
|
352
|
+
| `onLoadEnd?: (event) => void` | Function that is invoked when the WebView load succeeds or fails used. | function | No | All | yes |
|
|
353
|
+
| `onLoadProgress?: (event) => void` | Function that is invoked when the WebView is loading. | function | No | All | yes |
|
|
354
|
+
| `onMessage?: (event) => void` | Function that is invoked when the webview calls window.ReactNativeWebView.postMessage. | function | No | iOS,Android,macOS | yes |
|
|
355
|
+
| `onShouldStartLoadWithRequest?: (event) => void` | Function that allows custom handling of any web view requests. This feature needs to be used in conjunction with worker threads, and the relevant configuration can be set according to step three of [the worker threads](https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/TurboModule.md#%E8%AE%BE%E7%BD%AE%E8%87%AA%E5%AE%9A%E4%B9%89turbomodule%E8%BF%90%E8%A1%8C%E5%9C%A8worker%E7%BA%BF%E7%A8%8B).| function | No | iOS,Android,macOS | yes |
|
|
356
|
+
| `onContentProcessDidTerminate: (event) => void` | Function that is invoked when the `WebView` content process is terminated. | function | No | iOS and macOS WKWebView | No |
|
|
357
|
+
| `renderLoading?` | Function that returns a loading indicator. The `startInLoadingState` prop must be set to `true` in order to use this prop. | function | No | iOS, Android, macOS | No |
|
|
358
|
+
| `onCustomMenuSelection?` | Function called when a custom menu item is selected. It receives a Native event, which includes three custom keys: `label`, `key` and `selectedText`. | function | NO | iOS, Android | yes |
|
|
359
|
+
| `onNavigationStateChange?: (event) => void` | Function that is invoked when the WebView loading starts or ends. | function | NO | iOS, Android | yes |
|
|
360
|
+
| `onError: (event) => void` | Callback function for handling load errors. | function | NO | iOS,Android | yes |
|
|
361
|
+
| `onLoadSubResourceError: (event) => void <sup>13.16.1+</sup>` | Function that is sub resource SSL error handling. | function | NO | Android | yes |
|
|
362
|
+
## 静态方法
|
|
363
|
+
|
|
364
|
+
> [!TIP] "Platform"列表示该属性在原三方库上支持的平台。
|
|
365
|
+
|
|
366
|
+
> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。
|
|
367
|
+
|
|
368
|
+
| Name | Description | Type | Required | Platform | HarmonyOS Support |
|
|
369
|
+
| ---------------------------------- | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
|
|
370
|
+
| `goForward()` | Go forward one page in the web view's history. | function | No | All | yes |
|
|
371
|
+
| `goBack()` | Go back one page in the web view's history. | function | No | All | yes |
|
|
372
|
+
| `reload()` | Reloads the current page. | function | No | All | yes |
|
|
373
|
+
| `stopLoading()` | Stop loading the current page. | function | No | All | yes |
|
|
374
|
+
| `injectJavaScript(script: string)` | This function corresponds to the completion handler in Apple's recovery user interface ForPictureInPictureStop. IMPORTANT: This function must be called after calling onRestoreUserInterfaceForPictureInPictureStop. | function | No | All | yes |
|
|
375
|
+
| `requestFocus()` | Request the webView to ask for focus. (People working on TV apps might want having a look at this!) | function | No | All | yes |
|
|
376
|
+
| `postMessage(data:string)` | Post a message to WebView, handled by `onMessage`. | function | No | All | yes |
|
|
377
|
+
| `clearFormData()` | Removes the autocomplete popup from the currently focused form field, if present. | function | No | Android | No |
|
|
378
|
+
| `clearCache(status:boolean)` | Clears the resource cache. Note that the cache is per-application, so this will clear the cache for all WebViews used. | function | No | All | yes |
|
|
379
|
+
| `clearHistory()` | Tells this WebView to clear its internal back/forward list. | function | No | Android | yes |
|
|
380
|
+
|
|
381
|
+
## 遗留问题
|
|
382
|
+
|
|
383
|
+
- [ ] webview 部分属性未实现 HarmonyOS 化[issue#17](https://gitcode.com/openharmony-sig/rntpc_react-native-webview/issues/17)
|
|
384
|
+
- [ ] webview 部分属性未实现 HarmonyOS 化[issue#200](https://github.com/react-native-oh-library/react-native-webview/issues/200)
|
|
385
|
+
- [ ] V13.15.1 新增属性未实现 HarmonyOS 化[issue#2](https://gitcode.com/openharmony-sig/rntpc_react-native-webview/issues/2)
|
|
386
|
+
- [X] 中文乱码[issue#18](https://github.com/react-native-oh-library/react-native-webview/issues/18)
|
|
387
|
+
|
|
388
|
+
## 其他
|
|
389
|
+
|
|
390
|
+
## 开源协议
|
|
391
|
+
|
|
392
|
+
本项目基于 [The MIT License (MIT)](https://github.com/react-native-webview/react-native-webview/blob/master/LICENSE) ，请自由地享受和参与开源。
|
|
12
393
|
|
|
13
|
-
This library is licensed under [The MIT License (MIT)](https://github.com/react-native-oh-library/react-native-webview/blob/sig/LICENSE)
|
|
@@ -1,41 +1,17 @@
|
|
|
1
|
-
/**
|
|
2
|
-
*
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
*
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
|
-
/**
|
|
26
|
-
* Use these variables when you tailor your ArkTS code. They must be of the const type.
|
|
27
|
-
*/
|
|
28
|
-
export const HAR_VERSION = '13.10.4-rc.4';
|
|
29
|
-
export const BUILD_MODE_NAME = 'debug';
|
|
30
|
-
export const DEBUG = true;
|
|
31
|
-
export const TARGET_NAME = 'default';
|
|
32
|
-
|
|
33
|
-
/**
|
|
34
|
-
* BuildProfile Class is used only for compatibility purposes.
|
|
35
|
-
*/
|
|
36
|
-
export default class BuildProfile {
|
|
37
|
-
static readonly HAR_VERSION = HAR_VERSION;
|
|
38
|
-
static readonly BUILD_MODE_NAME = BUILD_MODE_NAME;
|
|
39
|
-
static readonly DEBUG = DEBUG;
|
|
40
|
-
static readonly TARGET_NAME = TARGET_NAME;
|
|
1
|
+
/**
|
|
2
|
+
* Use these variables when you tailor your ArkTS code. They must be of the const type.
|
|
3
|
+
*/
|
|
4
|
+
export const HAR_VERSION = '13.10.6-beta.3';
|
|
5
|
+
export const BUILD_MODE_NAME = 'debug';
|
|
6
|
+
export const DEBUG = true;
|
|
7
|
+
export const TARGET_NAME = 'default';
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* BuildProfile Class is used only for compatibility purposes.
|
|
11
|
+
*/
|
|
12
|
+
export default class BuildProfile {
|
|
13
|
+
static readonly HAR_VERSION = HAR_VERSION;
|
|
14
|
+
static readonly BUILD_MODE_NAME = BUILD_MODE_NAME;
|
|
15
|
+
static readonly DEBUG = DEBUG;
|
|
16
|
+
static readonly TARGET_NAME = TARGET_NAME;
|
|
41
17
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"meta": {
|
|
3
|
+
"stableOrder": true,
|
|
4
|
+
"enableUnifiedLockfile": false
|
|
5
|
+
},
|
|
6
|
+
"lockfileVersion": 3,
|
|
7
|
+
"ATTENTION": "THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.",
|
|
8
|
+
"specifiers": {
|
|
9
|
+
"@rnoh/react-native-openharmony@../../../../code/reanimated/tester/harmony/react-native-openharmony-0.72.59.har": "@rnoh/react-native-openharmony@../../../../code/reanimated/tester/harmony/react-native-openharmony-0.72.59.har"
|
|
10
|
+
},
|
|
11
|
+
"packages": {
|
|
12
|
+
"@rnoh/react-native-openharmony@../../../../code/reanimated/tester/harmony/react-native-openharmony-0.72.59.har": {
|
|
13
|
+
"name": "@rnoh/react-native-openharmony",
|
|
14
|
+
"version": "0.72.59",
|
|
15
|
+
"resolved": "../../../../code/reanimated/tester/harmony/react-native-openharmony-0.72.59.har",
|
|
16
|
+
"registryType": "local"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -86,6 +86,21 @@ export interface WebViewProps extends ViewRawProps {
|
|
|
86
86
|
applicationNameForUserAgent: string
|
|
87
87
|
pullToRefreshEnabled: boolean
|
|
88
88
|
schemeList: Array<string>
|
|
89
|
+
mediaCapturePermissionGrantType?: 'prompt' | 'grant' | 'deny' | 'grantIfSameHostElsePrompt' | 'grantIfSameHostElseDeny'
|
|
90
|
+
menuItems?: Array<MenuItem> | undefined;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
export interface MenuItem {
|
|
94
|
+
label: string,
|
|
95
|
+
key: string
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
export enum WebMediaCapturePermissionGrantType {
|
|
99
|
+
GRANT_IF_SAME_HOST_ELSE_PROMPT = "grantIfSameHostElsePrompt",
|
|
100
|
+
GRANT_IF_SAME_HOST_ELSE_DENY = "grantIfSameHostElseDeny",
|
|
101
|
+
DENY = "deny",
|
|
102
|
+
GRANT = "grant",
|
|
103
|
+
PROMPT = "prompt",
|
|
89
104
|
}
|
|
90
105
|
|
|
91
106
|
|
|
@@ -45,9 +45,11 @@ import {
|
|
|
45
45
|
WebViewDescriptor,
|
|
46
46
|
REFRESH_OFFSET,
|
|
47
47
|
MINHEIGHT,
|
|
48
|
+
WebMediaCapturePermissionGrantType,
|
|
49
|
+
MenuItem
|
|
48
50
|
} from './Magic';
|
|
49
51
|
|
|
50
|
-
import { bundleManager } from '@kit.AbilityKit';
|
|
52
|
+
import { abilityAccessCtrl, bundleManager, Permissions } from '@kit.AbilityKit';
|
|
51
53
|
import { WebViewTurboModule, ShouldStartParams, ShouldOverrideCallbackState } from './WebViewTurboModule';
|
|
52
54
|
import { AnyThreadRNInstance, WorkerTaskRunnable } from '@rnoh/react-native-openharmony/src/main/ets/RNOH';
|
|
53
55
|
import buffer from '@ohos.buffer';
|
|
@@ -455,33 +457,131 @@ export struct RNCWebView {
|
|
|
455
457
|
return false
|
|
456
458
|
}
|
|
457
459
|
|
|
460
|
+
onCreateMenu = (menuItems: Array<TextMenuItem>) => {
|
|
461
|
+
let customMenuItems = this.descriptorWrapper.rawProps.menuItems
|
|
462
|
+
if (customMenuItems == undefined) {
|
|
463
|
+
return menuItems;
|
|
464
|
+
} else if (customMenuItems.length == 0) {
|
|
465
|
+
return [];
|
|
466
|
+
} else {
|
|
467
|
+
let menuItemsArray: Array<TextMenuItem> = [];
|
|
468
|
+
for (let index = 0; index < customMenuItems.length; index++) {
|
|
469
|
+
let element: MenuItem = customMenuItems[index];
|
|
470
|
+
let customItem: TextMenuItem = {
|
|
471
|
+
content: element.label,
|
|
472
|
+
id: TextMenuItemId.of(element.key)
|
|
473
|
+
};
|
|
474
|
+
menuItemsArray.push(customItem)
|
|
475
|
+
}
|
|
476
|
+
return menuItemsArray;
|
|
477
|
+
}
|
|
478
|
+
}
|
|
479
|
+
|
|
480
|
+
onMenuItemClick(menuItem: TextMenuItem): boolean {
|
|
481
|
+
if (this.descriptorWrapper.rawProps.menuItems != undefined) {
|
|
482
|
+
this.controller.runJavaScript("(function(){return {selection: window.getSelection().toString()} })()")
|
|
483
|
+
.then((result: string) => {
|
|
484
|
+
this.webViewBaseOperate?.customMenuSelection(menuItem, result)
|
|
485
|
+
})
|
|
486
|
+
.catch((error: string | Error) => {
|
|
487
|
+
Logger.info('[RNOH] function onMenuItemClick error: ' + error);
|
|
488
|
+
})
|
|
489
|
+
// 禁用系统默认行为
|
|
490
|
+
return true;
|
|
491
|
+
}
|
|
492
|
+
return false;
|
|
493
|
+
}
|
|
494
|
+
|
|
495
|
+
onPermissionRequestAlert(event: OnPermissionRequestEvent){
|
|
496
|
+
AlertDialog.show({
|
|
497
|
+
title: this.resourceToString($r('app.string.on_confirm')) + event.request.getOrigin(),
|
|
498
|
+
message: this.getPermissionDialogMessage(event),
|
|
499
|
+
alignment: DialogAlignment.Center,
|
|
500
|
+
primaryButton: {
|
|
501
|
+
value: $r('app.string.deny'),
|
|
502
|
+
action: () => {
|
|
503
|
+
event.request.deny();
|
|
504
|
+
}
|
|
505
|
+
},
|
|
506
|
+
secondaryButton: {
|
|
507
|
+
value: $r('app.string.on_confirm'),
|
|
508
|
+
action: () => {
|
|
509
|
+
event.request.grant(event.request.getAccessibleResource());
|
|
510
|
+
}
|
|
511
|
+
},
|
|
512
|
+
cancel: () => {
|
|
513
|
+
event.request.deny();
|
|
514
|
+
}
|
|
515
|
+
})
|
|
516
|
+
}
|
|
517
|
+
|
|
518
|
+
async handleMediaCapturePermissionGrantType(resources: string[], domain: string) {
|
|
519
|
+
let permissionList: Array<Permissions> = [];
|
|
520
|
+
resources.forEach(resource => {
|
|
521
|
+
switch (resource.toString()) {
|
|
522
|
+
case 'TYPE_VIDEO_CAPTURE':
|
|
523
|
+
permissionList.push('ohos.permission.CAMERA');
|
|
524
|
+
break;
|
|
525
|
+
case 'TYPE_AUDIO_CAPTURE':
|
|
526
|
+
permissionList.push('ohos.permission.MICROPHONE');
|
|
527
|
+
break;
|
|
528
|
+
}
|
|
529
|
+
});
|
|
530
|
+
|
|
531
|
+
let atManager = abilityAccessCtrl.createAtManager();
|
|
532
|
+
await atManager.requestPermissionsFromUser(this.ctx.uiAbilityContext, permissionList);
|
|
533
|
+
}
|
|
534
|
+
|
|
458
535
|
build() {
|
|
459
536
|
Stack() {
|
|
460
537
|
if ( deviceInfo.sdkApiVersion >= 20) {
|
|
461
538
|
Web({ src: "", controller: this.controller, renderMode: this.renderMode })
|
|
462
539
|
.mixedMode(this.mode)
|
|
463
|
-
.onPermissionRequest((event: OnPermissionRequestEvent) => {
|
|
540
|
+
.onPermissionRequest(async (event: OnPermissionRequestEvent) => {
|
|
464
541
|
if (event && (this.getPermissionDialogMessage(event) != "TYPE_SENSOR")) {
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
542
|
+
const resources: string[] = event.request.getAccessibleResource();
|
|
543
|
+
if (resources.indexOf('TYPE_AUDIO_CAPTURE') >= 0 || resources.indexOf('TYPE_VIDEO_CAPTURE') >= 0 ) {
|
|
544
|
+
const originUrl = this.webViewBaseOperate?.verifyURLFormat(event.request.getOrigin(), this.source.html,
|
|
545
|
+
this.source.baseUrl);
|
|
546
|
+
const currentUrl = this.webViewBaseOperate?.verifyURLFormat(this.controller.getUrl(), this.source.html,
|
|
547
|
+
this.source.baseUrl);
|
|
548
|
+
const originDomain: string = OSUrl.URL.parseURL(originUrl).hostname;
|
|
549
|
+
const currentDomain: string = OSUrl.URL.parseURL(currentUrl).hostname;
|
|
550
|
+
let mediaCapturePermissionGrantType: string = WebMediaCapturePermissionGrantType.PROMPT
|
|
551
|
+
if (this.descriptorWrapper.rawProps.mediaCapturePermissionGrantType != undefined) {
|
|
552
|
+
mediaCapturePermissionGrantType = this.descriptorWrapper.rawProps.mediaCapturePermissionGrantType;
|
|
553
|
+
}
|
|
554
|
+
if (mediaCapturePermissionGrantType != WebMediaCapturePermissionGrantType.DENY) {
|
|
555
|
+
await this.handleMediaCapturePermissionGrantType(resources, originDomain)
|
|
556
|
+
}
|
|
557
|
+
switch (mediaCapturePermissionGrantType) {
|
|
558
|
+
case WebMediaCapturePermissionGrantType.GRANT_IF_SAME_HOST_ELSE_PROMPT:
|
|
559
|
+
if (originDomain != currentDomain) {
|
|
560
|
+
this.onPermissionRequestAlert(event)
|
|
561
|
+
} else {
|
|
562
|
+
event.request.grant(resources);
|
|
563
|
+
}
|
|
564
|
+
break;
|
|
565
|
+
case WebMediaCapturePermissionGrantType.GRANT_IF_SAME_HOST_ELSE_DENY:
|
|
566
|
+
if (originDomain != currentDomain) {
|
|
567
|
+
event.request.deny();
|
|
568
|
+
} else {
|
|
569
|
+
event.request.grant(resources);
|
|
570
|
+
}
|
|
571
|
+
break;
|
|
572
|
+
case WebMediaCapturePermissionGrantType.DENY:
|
|
472
573
|
event.request.deny();
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
},
|
|
481
|
-
cancel: () => {
|
|
482
|
-
event.request.deny();
|
|
574
|
+
break;
|
|
575
|
+
case WebMediaCapturePermissionGrantType.GRANT:
|
|
576
|
+
event.request.grant(resources);
|
|
577
|
+
break;
|
|
578
|
+
case WebMediaCapturePermissionGrantType.PROMPT:
|
|
579
|
+
this.onPermissionRequestAlert(event)
|
|
580
|
+
break;
|
|
483
581
|
}
|
|
484
|
-
}
|
|
582
|
+
} else {
|
|
583
|
+
this.onPermissionRequestAlert(event)
|
|
584
|
+
}
|
|
485
585
|
}
|
|
486
586
|
})
|
|
487
587
|
.width(this.webviewWidth)
|
|
@@ -529,31 +629,58 @@ export struct RNCWebView {
|
|
|
529
629
|
.onRenderExited((event: OnRenderExitedEvent) => this.webViewBaseOperate?.onRenderExited(event))
|
|
530
630
|
.onLoadIntercept((event: OnLoadInterceptEvent) => this.onLoadIntercept(event))
|
|
531
631
|
.onTitleReceive((event: OnTitleReceiveEvent) => this.webViewBaseOperate?.onTitleReceive(event))
|
|
632
|
+
.editMenuOptions({
|
|
633
|
+
onCreateMenu: this.onCreateMenu.bind(this),
|
|
634
|
+
onMenuItemClick: this.onMenuItemClick.bind(this),
|
|
635
|
+
})
|
|
532
636
|
} else {
|
|
533
637
|
Web({ src: "", controller: this.controller, renderMode: this.renderMode })
|
|
534
638
|
.mixedMode(this.mode)
|
|
535
|
-
.onPermissionRequest((event: OnPermissionRequestEvent) => {
|
|
639
|
+
.onPermissionRequest(async (event: OnPermissionRequestEvent) => {
|
|
536
640
|
if (event && (this.getPermissionDialogMessage(event) != "TYPE_SENSOR")) {
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
641
|
+
const resources: string[] = event.request.getAccessibleResource();
|
|
642
|
+
if (resources.indexOf('TYPE_AUDIO_CAPTURE') >= 0 || resources.indexOf('TYPE_VIDEO_CAPTURE') >= 0 ) {
|
|
643
|
+
const originUrl = this.webViewBaseOperate?.verifyURLFormat(event.request.getOrigin(), this.source.html,
|
|
644
|
+
this.source.baseUrl);
|
|
645
|
+
const currentUrl = this.webViewBaseOperate?.verifyURLFormat(this.controller.getUrl(), this.source.html,
|
|
646
|
+
this.source.baseUrl);
|
|
647
|
+
const originDomain: string = OSUrl.URL.parseURL(originUrl).hostname;
|
|
648
|
+
const currentDomain: string = OSUrl.URL.parseURL(currentUrl).hostname;
|
|
649
|
+
let mediaCapturePermissionGrantType: string = WebMediaCapturePermissionGrantType.PROMPT
|
|
650
|
+
if (this.descriptorWrapper.rawProps.mediaCapturePermissionGrantType != undefined) {
|
|
651
|
+
mediaCapturePermissionGrantType = this.descriptorWrapper.rawProps.mediaCapturePermissionGrantType;
|
|
652
|
+
}
|
|
653
|
+
if (mediaCapturePermissionGrantType != WebMediaCapturePermissionGrantType.DENY) {
|
|
654
|
+
await this.handleMediaCapturePermissionGrantType(resources, originDomain)
|
|
655
|
+
}
|
|
656
|
+
switch (mediaCapturePermissionGrantType) {
|
|
657
|
+
case WebMediaCapturePermissionGrantType.GRANT_IF_SAME_HOST_ELSE_PROMPT:
|
|
658
|
+
if (originDomain != currentDomain) {
|
|
659
|
+
this.onPermissionRequestAlert(event)
|
|
660
|
+
} else {
|
|
661
|
+
event.request.grant(resources);
|
|
662
|
+
}
|
|
663
|
+
break;
|
|
664
|
+
case WebMediaCapturePermissionGrantType.GRANT_IF_SAME_HOST_ELSE_DENY:
|
|
665
|
+
if (originDomain != currentDomain) {
|
|
666
|
+
event.request.deny();
|
|
667
|
+
} else {
|
|
668
|
+
event.request.grant(resources);
|
|
669
|
+
}
|
|
670
|
+
break;
|
|
671
|
+
case WebMediaCapturePermissionGrantType.DENY:
|
|
544
672
|
event.request.deny();
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
},
|
|
553
|
-
cancel: () => {
|
|
554
|
-
event.request.deny();
|
|
673
|
+
break;
|
|
674
|
+
case WebMediaCapturePermissionGrantType.GRANT:
|
|
675
|
+
event.request.grant(resources);
|
|
676
|
+
break;
|
|
677
|
+
case WebMediaCapturePermissionGrantType.PROMPT:
|
|
678
|
+
this.onPermissionRequestAlert(event)
|
|
679
|
+
break;
|
|
555
680
|
}
|
|
556
|
-
}
|
|
681
|
+
} else {
|
|
682
|
+
this.onPermissionRequestAlert(event)
|
|
683
|
+
}
|
|
557
684
|
}
|
|
558
685
|
})
|
|
559
686
|
|
|
@@ -601,7 +728,10 @@ export struct RNCWebView {
|
|
|
601
728
|
.onRenderExited((event: OnRenderExitedEvent) => this.webViewBaseOperate?.onRenderExited(event))
|
|
602
729
|
.onLoadIntercept((event: OnLoadInterceptEvent) => this.onLoadIntercept(event))
|
|
603
730
|
.onTitleReceive((event: OnTitleReceiveEvent) => this.webViewBaseOperate?.onTitleReceive(event))
|
|
604
|
-
|
|
731
|
+
.editMenuOptions({
|
|
732
|
+
onCreateMenu: this.onCreateMenu.bind(this),
|
|
733
|
+
onMenuItemClick: this.onMenuItemClick.bind(this),
|
|
734
|
+
})
|
|
605
735
|
}
|
|
606
736
|
}
|
|
607
737
|
.width(this.webviewWidth)
|
|
@@ -629,11 +759,13 @@ export struct RNCWebView {
|
|
|
629
759
|
let postData = buffer.from(this.source.body);
|
|
630
760
|
this.controller.postUrl(url, postData?.buffer);
|
|
631
761
|
}
|
|
632
|
-
} else if (this.url
|
|
762
|
+
} else if (typeof this.url !== typeof this.source.uri
|
|
763
|
+
|| (typeof this.source.uri === "string" && this.url !== this.source.uri)
|
|
764
|
+
|| (typeof this.source.uri === "object" && (this.url as Resource)?.params !== this.source.uri?.params)) {
|
|
633
765
|
if (this.source.uri != "") {
|
|
634
766
|
Logger.debug(TAG, `[RNOH] newDescriptor props update uri: ` + this.source.uri);
|
|
635
767
|
if (this.controllerAttached) {
|
|
636
|
-
this.controller.loadUrl(this.
|
|
768
|
+
this.controller.loadUrl(this.source.uri, this.headers)
|
|
637
769
|
}
|
|
638
770
|
} else {
|
|
639
771
|
this.loadHtmlData()
|
|
@@ -474,4 +474,17 @@ export class BaseOperate {
|
|
|
474
474
|
Logger.error(TAG, `[RNOH] onTitleReceive Errorcode: ${error.code}`);
|
|
475
475
|
}
|
|
476
476
|
}
|
|
477
|
+
|
|
478
|
+
customMenuSelection(menuItem: TextMenuItem, selectionText: string) {
|
|
479
|
+
try {
|
|
480
|
+
selectionText = JSON.parse(selectionText).selection;
|
|
481
|
+
this.eventEmitter!.emit('customMenuSelection', {
|
|
482
|
+
label: menuItem.content.toString(),
|
|
483
|
+
key: JSON.parse(JSON.stringify(menuItem.id)).id_,
|
|
484
|
+
selectedText: selectionText
|
|
485
|
+
})
|
|
486
|
+
} catch (error) {
|
|
487
|
+
Logger.error(TAG, `[RNOH] customMenuSelection Errorcode: ${error.code}`);
|
|
488
|
+
}
|
|
489
|
+
}
|
|
477
490
|
}
|
package/harmony/rn_webview.har
CHANGED
|
Binary file
|
package/package.json
CHANGED
|
@@ -9,8 +9,8 @@
|
|
|
9
9
|
"Thibault Malbranche <malbranche.thibault@gmail.com>"
|
|
10
10
|
],
|
|
11
11
|
"license": "MIT",
|
|
12
|
-
"version": "13.10.
|
|
13
|
-
"homepage": "https://
|
|
12
|
+
"version": "13.10.6-beta.3",
|
|
13
|
+
"homepage": "https://gitcode.com/openharmony-sig/rntpc_react-native-webview#readme",
|
|
14
14
|
"scripts": {
|
|
15
15
|
"macos": "react-native run-macos --scheme WebviewExample --project-path example/macos",
|
|
16
16
|
"start": "react-native start",
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
},
|
|
74
74
|
"repository": {
|
|
75
75
|
"type": "git",
|
|
76
|
-
"url": "git://
|
|
76
|
+
"url": "git://gitcode.com/openharmony-sig/rntpc_react-native-webview.git"
|
|
77
77
|
},
|
|
78
78
|
"files": [
|
|
79
79
|
"src",
|
package/src/WebView.harmony.tsx
CHANGED
|
@@ -64,7 +64,7 @@ const WebViewComponent = forwardRef<{}, IOSWebViewProps & { scalesPageToFit: boo
|
|
|
64
64
|
textInteractionEnabled = true,
|
|
65
65
|
injectedJavaScript,
|
|
66
66
|
injectedJavaScriptBeforeContentLoaded,
|
|
67
|
-
menuItems
|
|
67
|
+
menuItems,
|
|
68
68
|
injectedJavaScriptForMainFrameOnly = true,
|
|
69
69
|
injectedJavaScriptBeforeContentLoadedForMainFrameOnly = true,
|
|
70
70
|
thirdPartyCookiesEnabled = false,
|