未验证 提交 7b6d0ee9 编写于 作者: O openharmony_ci 提交者: Gitee

!13488 翻译完成 13102+13048+13132+12831+12746+12759

Merge pull request !13488 from ester.zhou/TR-13102
# @ohos.web.webview (Webview)
# @ohos.web.webview
The **Webview** module provides APIs for web control.
......@@ -19,6 +19,46 @@ The **Webview** module provides APIs for web control.
```ts
import web_webview from '@ohos.web.webview';
```
### once
once(type: string, callback: Callback\<void\>): void
Registers a one-time callback for web events of the specified type.
**System capability**: SystemCapability.Web.Webview.Core
**Parameters**
| Name | Type | Mandatory| Description |
| ------- | ---------------- | ---- | -------------------- |
| type | string | Yes | Web event type. The value can be **"webInited"**, indicating completion of web initialization. |
| headers | Callback\<void\> | Yes | Callback to register.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
web_webview.once("webInited", () => {
console.log("setCookie")
web_webview.WebCookieManager.setCookie("www.example.com", "a=b")
})
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
## WebMessagePort
Implements a **WebMessagePort** object to send and receive messages.
......@@ -61,7 +101,7 @@ struct WebComponent {
### postMessageEvent
postMessageEvent(message: string): void
postMessageEvent(message: WebMessage): void
Sends a message. For the complete sample code, see [postMessage](#postmessage).
......@@ -71,7 +111,7 @@ Sends a message. For the complete sample code, see [postMessage](#postmessage).
| Name | Type | Mandatory| Description |
| ------- | ------ | ---- | :------------- |
| message | string | Yes | Message to send.|
| message | [WebMessage](#webmessage) | Yes | Message to send.|
**Error codes**
......@@ -113,7 +153,7 @@ struct WebComponent {
### onMessageEvent
onMessageEvent(callback: (result: string) => void): void
onMessageEvent(callback: (result: WebMessage) => void): void
Registers a callback to receive messages from the HTML5 side. For the complete sample code, see [postMessage](#postmessage).
......@@ -123,7 +163,7 @@ Registers a callback to receive messages from the HTML5 side. For the complete s
| Name | Type | Mandatory| Description |
| -------- | -------- | ---- | :------------------- |
| result | string | Yes | Message received.|
| result | [WebMessage](#webmessage) | Yes | Message received.|
**Error codes**
......@@ -152,7 +192,17 @@ struct WebComponent {
try {
this.ports = this.controller.createWebMessagePorts();
this.ports[1].onMessageEvent((msg) => {
console.log("received message from html5, on message:" + msg);
if (typeof(msg) == "string") {
console.log("received string message from html5, string is:" + msg);
} else if (typeof(msg) == "object") {
if (msg instanceof ArrayBuffer) {
console.log("received arraybuffer from html5, length is:" + msg.byteLength);
} else {
console.log("not support");
}
} else {
console.log("not support");
}
})
} catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
......@@ -166,13 +216,40 @@ struct WebComponent {
## WebviewController
Implements a **WebviewController** to control the behavior of the **\<Web>** component. A **WebviewController** can control only one **\<Web>** component, and the APIs in the **WebviewController** can be invoked only after it has been bound to the target **\<Web>** component.
Implements a **WebviewController** to control the behavior of the **\<Web>** component. A **WebviewController** can control only one **\<Web>** component, and the APIs (except static APIs) in the **WebviewController** can be invoked only after it has been bound to the target **\<Web>** component.
### initializeWebEngine
static initializeWebEngine(): void
Loads the dynamic link library (DLL) file of the web engine. This API can be called before the **\<Web>** component is initialized to improve the startup performance.
**System capability**: SystemCapability.Web.Webview.Core
**Example**
The following code snippet exemplifies calling this API after the EntryAbility is created.
```ts
// xxx.ts
import UIAbility from '@ohos.app.ability.UIAbility';
import web_webview from '@ohos.web.webview';
export default class EntryAbility extends UIAbility {
onCreate(want, launchParam) {
console.log("EntryAbility onCreate")
web_webview.WebviewController.initializeWebEngine()
globalThis.abilityWant = want
console.log("EntryAbility onCreate done")
}
}
```
### Creating an Object
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
import web_webview from '@ohos.web.webview';
@Entry
@Component
......@@ -1397,8 +1474,21 @@ struct WebComponent {
// 2. Send one of the message ports to the HTML side, which can then save and use the port.
this.controller.postMessage('__init_port__', [this.ports[0]], '*');
// 3. Register a callback for the other message port on the application side.
this.ports[1].onMessageEvent((result: string) => {
var msg = 'Got msg from HTML: ' + result;
this.ports[1].onMessageEvent((result: WebMessage) => {
var msg = 'Got msg from HTML:';
if (typeof(result) == "string") {
console.log("received string message from html5, string is:" + result);
msg = msg + result;
} else if (typeof(result) == "object") {
if (result instanceof ArrayBuffer) {
console.log("received arraybuffer from html5, length is:" + result.byteLength);
msg = msg + "lenght is " + result.byteLength;
} else {
console.log("not support");
}
} else {
console.log("not support");
}
this.receivedFromHtml = msg;
})
} catch (error) {
......@@ -1456,7 +1546,21 @@ window.addEventListener('message', function (event) {
The h5Port = event.ports[0]; // 1. Save the port number sent from the eTS side.
h5Port.onmessage = function (event) {
// 2. Receive the message sent from the eTS side.
var msg = 'Got message from ets:' + event.data;
var msg = 'Got message from ets:';
var result = event.data;
if (typeof(result) == "string") {
console.log("received string message from html5, string is:" + result);
msg = msg + result;
} else if (typeof(result) == "object") {
if (result instanceof ArrayBuffer) {
console.log("received arraybuffer from html5, length is:" + result.byteLength);
msg = msg + "lenght is " + result.byteLength;
} else {
console.log("not support");
}
} else {
console.log("not support");
}
output.innerHTML = msg;
}
}
......@@ -1759,7 +1863,7 @@ struct WebComponent {
getTitle(): string
Obtains the title of the file selector.
Obtains the title of the current web page.
**System capability**: SystemCapability.Web.Webview.Core
......@@ -1767,7 +1871,7 @@ Obtains the title of the file selector.
| Type | Description |
| ------ | -------------------- |
| string | Title of the file selector.|
| string | Title of the current web page.|
**Error codes**
......@@ -2123,6 +2227,222 @@ struct WebComponent {
}
```
### scrollTo
scrollTo(x:number, y:number): void
Scrolls the page to the specified absolute position.
**System capability**: SystemCapability.Web.Webview.Core
**Parameters**
| Name| Type| Mandatory| Description |
| ------ | -------- | ---- | ---------------------- |
| x | number | Yes | X coordinate of the absolute position. If the value is a negative number, the value 0 is used.|
| y | number | Yes | Y coordinate of the absolute position. If the value is a negative number, the value 0 is used.|
**Error codes**
For details about the error codes, see [Webview Error Codes](../errorcodes/errorcode-webview.md).
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web component. |
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
build() {
Column() {
Button('scrollTo')
.onClick(() => {
try {
this.controller.scrollTo(50, 50);
} catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
}
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
```html
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<style>
body {
width:3000px;
height:3000px;
padding-right:170px;
padding-left:170px;
border:5px solid blueviolet
}
</style>
</head>
<body>
Scroll Test
</body>
</html>
```
### scrollBy
scrollBy(deltaX:number, deltaY:number): void
Scrolls the page by the specified amount.
**System capability**: SystemCapability.Web.Webview.Core
**Parameters**
| Name| Type| Mandatory| Description |
| ------ | -------- | ---- | ---------------------- |
| deltaX | number | Yes | Amount to scroll by along the x-axis. The positive direction is rightward.|
| deltaY | number | Yes | Amount to scroll by along the y-axis. The positive direction is downward.|
**Error codes**
For details about the error codes, see [Webview Error Codes](../errorcodes/errorcode-webview.md).
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web component. |
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
build() {
Column() {
Button('scrollBy')
.onClick(() => {
try {
this.controller.scrollBy(50, 50);
} catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
}
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
```html
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<style>
body {
width:3000px;
height:3000px;
padding-right:170px;
padding-left:170px;
border:5px solid blueviolet
}
</style>
</head>
<body>
Scroll Test
</body>
</html>
```
### slideScroll
slideScroll(vx:number, vy:number): void
Simulates a slide-to-scroll action on the page at the specified velocity.
**System capability**: SystemCapability.Web.Webview.Core
**Parameters**
| Name| Type| Mandatory| Description |
| ------ | -------- | ---- | ---------------------- |
| vx | number | Yes | Horizontal velocity component of the slide-to-scroll action, where the positive direction is rightward.|
| vy | number | Yes | Vertical velocity component of the slide-to-scroll action, where the positive direction is downward.|
**Error codes**
For details about the error codes, see [Webview Error Codes](../errorcodes/errorcode-webview.md).
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web component. |
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
build() {
Column() {
Button('slideScroll')
.onClick(() => {
try {
this.controller.slideScroll(500, 500);
} catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
}
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
```html
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<style>
body {
width:3000px;
height:3000px;
padding-right:170px;
padding-left:170px;
border:5px solid blueviolet
}
</style>
</head>
<body>
Scroll Test
</body>
</html>
```
### getOriginalUrl
getOriginalUrl(): string
......@@ -2244,7 +2564,6 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web component. |
| 401 | Invalid input parameter. |
**Example**
......@@ -2275,7 +2594,7 @@ struct WebComponent {
### hasImage
hasImage(callback: AsyncCallback<boolean>): void
hasImage(callback: AsyncCallback\<boolean>): void
Checks whether this page contains images. This API uses an asynchronous callback to return the result.
......@@ -2294,7 +2613,6 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web compoent. |
| 401 | Invalid input parameter. |
**Example**
......@@ -2312,7 +2630,7 @@ struct WebComponent {
Button('hasImageCb')
.onClick(() => {
try {
this.controller.hasImage((err, data) => {
this.controller.hasImage((error, data) => {
if (error) {
console.info(`hasImage error: ` + JSON.stringify(error))
return;
......@@ -2331,7 +2649,7 @@ struct WebComponent {
### hasImage
hasImage(): Promise<boolean>
hasImage(): Promise\<boolean>
Checks whether this page contains images. This API uses a promise to return the result.
......@@ -2350,7 +2668,6 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web compoent. |
| 401 | Invalid input parameter. |
**Example**
......@@ -2396,7 +2713,7 @@ Clears the cache in the application. This API will clear the cache for all webvi
| Name | Type | Mandatory| Description |
| -------- | ------- | ---- | -------------------------------------------------------- |
| clearRom | boolean | Yes | Whether to clear the cache in the ROM and RAM at the same time. The value **false** means to only clear the cache in the RAM.|
| clearRom | boolean | Yes | Whether to clear the cache in the ROM and RAM at the same time. The value **true** means to clear the cache in the ROM and RAM at the same time, and **false** means to only clear the cache in the RAM.|
**Error codes**
......@@ -2405,7 +2722,6 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error
| ID| Error Message |
| -------- | ------------------------------------------------------------ |
| 17100001 | Init error. The WebviewController must be associated with a Web component. |
| 401 | Invalid input parameter. |
**Example**
......@@ -2483,9 +2799,58 @@ struct WebComponent {
}
```
### customizeSchemes
static customizeSchemes(schemes: Array\<WebCustomScheme\>): void
Customizes the URL schemes (also known as protocols). It is recommended that this API be called before any **\<Web>** component is initialized.
**System capability**: SystemCapability.Web.Webview.Core
**Parameters**
| Name | Type | Mandatory| Description |
| -------- | ------- | ---- | -------------------------------------- |
| schemes | Array\<[WebCustomScheme](#webcustomscheme)\> | Yes | Array of up to 10 custom schemes.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
responseweb: WebResourceResponse = new WebResourceResponse()
scheme1: web_webview.WebCustomScheme = {schemeName: "name1", isSupportCORS: true, isSupportFetch: true}
scheme2: web_webview.WebCustomScheme = {schemeName: "name2", isSupportCORS: true, isSupportFetch: true}
scheme3: web_webview.WebCustomScheme = {schemeName: "name3", isSupportCORS: true, isSupportFetch: true}
aboutToAppear():void {
try {
web_webview.WebviewController.customizeSchemes([this.scheme1, this.scheme2, this.scheme3])
} catch(error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
}
}
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onInterceptRequest((event) => {
console.log('url:' + event.request.getRequestUrl())
return this.responseweb
})
}
}
}
```
## WebCookieManager
Implements a **WebCookie** object to manage behavior of cookies in **\<Web>** components. All **\<Web>** components in an application share a **WebCookie** object.
Implements a **WebCookieManager** instance to manage behavior of cookies in **\<Web>** components. All **\<Web>** components in an application share a **WebCookieManager** instance.
### getCookie
......@@ -3600,7 +3965,7 @@ Implements a **WebAsyncController** object, which can be used to control the beh
@Component
struct WebComponent {
controller: WebController = new WebController();
webAsyncController: WebAsyncController = new web_webview.WebAsyncController(this.controller)
webAsyncController: web_webview.WebAsyncController = new web_webview.WebAsyncController(this.controller)
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -3635,8 +4000,8 @@ Stores this web page. This API uses an asynchronous callback to return the resul
| Name | Type | Mandatory | Description |
| -------- | ---------------------------------------- | ---- | ----------------------------------- |
| baseName | string | Yes| Save path. The value cannot be null.
| autoName | boolean | Yes| Whether to automatically generate a file name.<br>The value **false** means not to automatically generate a file name.<br>The value **true** means to automatically generate a file name based on the URL of current page and the **baseName** value. In this case, **baseName** is regarded as a directory.
| baseName | string | Yes| Save path. The value cannot be null. |
| autoName | boolean | Yes| Whether to automatically generate a file name.<br>The value **false** means not to automatically generate a file name.<br>The value **true** means to automatically generate a file name based on the URL of current page and the **baseName** value. In this case, **baseName** is regarded as a directory. |
| callback | AsyncCallback\<string> | Yes | Callback used to return the save path if the operation is successful and null otherwise.|
**Example**
......@@ -3677,14 +4042,14 @@ Stores this web page. This API uses a promise to return the result.
| Name | Type | Mandatory | Description |
| -------- | ---------------------------------------- | ---- | ----------------------------------- |
| baseName | string | Yes| Save path. The value cannot be null.
| autoName | boolean | Yes| Whether to automatically generate a file name.<br>The value **false** means not to automatically generate a file name.<br>The value **true** means to automatically generate a file name based on the URL of current page and the **baseName** value. In this case, **baseName** is regarded as a directory.
| baseName | string | Yes| Save path. The value cannot be null. |
| autoName | boolean | Yes| Whether to automatically generate a file name.<br>The value **false** means not to automatically generate a file name.<br>The value **true** means to automatically generate a file name based on the URL of current page and the **baseName** value. In this case, **baseName** is regarded as a directory. |
**Return value**
| Type | Description |
| ---------------------------------------- | ---------------------------------------- |
| Promise<string> | Promise used to return the save path if the operation is successful and null otherwise.|
| Type | Description |
| ---------------- | ------------------------------------------------------------ |
| Promise\<string> | Promise used to return the save path if the operation is successful and null otherwise. |
**Example**
......@@ -4100,6 +4465,15 @@ Provides the element information of the area being clicked. For details about th
| type | [HitTestTypeV9](#hittesttypev9) | Yes| No| Element type of the area being clicked.|
| extra | string | Yes| No|Extra information of the area being clicked. If the area being clicked is an image or a link, the extra information is the URL of the image or link.|
## WebMessage
Describes the data types supported for [WebMessagePort](#webmessageport).
| Type | Description |
| -------- | -------------------------------------- |
| string | String type.|
| ArrayBuffer | Binary type.|
## WebStorageOrigin
Provides usage information of the Web SQL Database.
......@@ -4143,14 +4517,6 @@ Obtains the page record with the specified index in the history stack.
| --------------------------- | ------------ |
| [HistoryItem](#historyitem) | Historical page record.|
**Error codes**
For details about the error codes, see [Webview Error Codes](../errorcodes/errorcode-webview.md).
| ID| Error Message |
| -------- | ----------------------- |
| 401 | Invalid input parameter |
**Example**
```ts
......@@ -4172,7 +4538,7 @@ struct WebComponent {
let list = this.controller.getBackForwardEntries();
let historyItem = list.getItemAtIndex(list.currentIndex);
console.log("HistoryItem: " + JSON.stringify(historyItem));
this.icon = item.icon;
this.icon = historyItem.icon;
} catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
}
......@@ -4196,4 +4562,14 @@ Describes a historical page record.
| historyRawUrl | string | Yes | No | Original URL of the historical page. |
| title | string | Yes | No | Title of the historical page. |
###
## WebCustomScheme
Defines a custom URL scheme.
**System capability**: SystemCapability.Web.Webview.Core
| Name | Type | Readable| Writable| Description |
| -------------- | --------- | ---- | ---- | ---------------------------- |
| schemeName | string | Yes | Yes | Name of the custom URL scheme. The value can contain a maximum of 32 characters and include only lowercase letters, digits, periods (.), plus signs (+), and hyphens (-). |
| isSupportCORS | boolean | Yes | Yes | Whether to support cross-origin resource sharing (CORS). |
| isSupportFetch | boolean | Yes | Yes | Whether to support fetch requests. |
......@@ -467,13 +467,13 @@ Sets whether to enable geolocation access. By default, this feature is enabled.
mediaPlayGestureAccess(access: boolean)
Sets whether a manual click is required for video playback.
Sets whether video playback must be started by user gestures. This API is not applicable to videos that do not have an audio track or whose audio track is muted.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ------ | ------- | ---- | ---- | ----------------- |
| access | boolean | Yes | true | Whether a manual click is required for video playback.|
| access | boolean | Yes | true | Whether video playback must be started by user gestures.|
**Example**
......@@ -522,6 +522,109 @@ Sets whether to enable the multi-window permission.
}
```
### horizontalScrollBarAccess<sup>9+</sup>
horizontalScrollBarAccess(horizontalScrollBar: boolean)
Sets whether to display the horizontal scrollbar, including the system default scrollbar and custom scrollbar. By default, the horizontal scrollbar is displayed.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ----------- | ------- | ---- | ----- | ------------ |
| horizontalScrollBar | boolean | Yes | true | Whether to display the horizontal scrollbar.|
**Example**
```ts
// xxx.ets
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.horizontalScrollBarAccess(true)
}
}
}
```
```html
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<style>
body {
width:3000px;
height:3000px;
padding-right:170px;
padding-left:170px;
border:5px solid blueviolet
}
</style>
</head>
<body>
Scroll Test
</body>
</html>
```
### verticalScrollBarAccess<sup>9+</sup>
verticalScrollBarAccess(verticalScrollBar: boolean)
Sets whether to display the vertical scrollbar, including the system default scrollbar and custom scrollbar. By default, the vertical scrollbar is displayed.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ----------- | ------- | ---- | ----- | ------------ |
| verticalScrollBarAccess | boolean | Yes | true | Whether to display the vertical scrollbar.|
**Example**
```ts
// xxx.ets
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.verticalScrollBarAccess(true)
}
}
}
```
```html
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<style>
body {
width:3000px;
height:3000px;
padding-right:170px;
padding-left:170px;
border:5px solid blueviolet
}
</style>
</head>
<body>
Scroll Test
</body>
</html>
```
### cacheMode
cacheMode(cacheMode: CacheMode)
......@@ -707,13 +810,13 @@ Sets whether to block online downloads.
defaultFixedFontSize(size: number)
Sets the default fixed font size of the web page.
Sets the default fixed font size for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value| Description |
| ------ | -------- | ---- | ------ | ---------------------------- |
| size | number | Yes | 13 | Default fixed font size of the web page. The value is a non-negative integer ranging from 1 to 72. If the value is less than 1, the value 1 is used. If the value is greater than 72, the value 72 is used.|
| size | number | Yes | 13 | Default fixed font size to set, in px. The value ranges from -2^31 to 2^31-1. In actual rendering, values greater than 72 are handled as 72, and values less than 1 are handled as 1. |
**Example**
......@@ -724,11 +827,11 @@ Sets the default fixed font size of the web page.
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State size: number = 16
@State fontSize: number = 16
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.defaultFixedFontSize(this.size)
.defaultFixedFontSize(this.fontSize)
}
}
}
......@@ -738,13 +841,13 @@ Sets the default fixed font size of the web page.
defaultFontSize(size: number)
Sets the default font size of the web page.
Sets the default font size for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value| Description |
| ------ | -------- | ---- | ------ | ------------------------ |
| size | number | Yes | 16 | Default font size of the web page. The value is a non-negative integer ranging from 1 to 72. If the value is less than 1, the value 1 is used. If the value is greater than 72, the value 72 is used.|
| size | number | Yes | 16 | Default font size to set, in px. The value ranges from -2^31 to 2^31-1. In actual rendering, values greater than 72 are handled as 72, and values less than 1 are handled as 1. |
**Example**
......@@ -755,11 +858,11 @@ Sets the default font size of the web page.
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State size: number = 13
@State fontSize: number = 13
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.defaultFontSize(this.size)
.defaultFontSize(this.fontSize)
}
}
}
......@@ -769,13 +872,44 @@ Sets the default font size of the web page.
minFontSize(size: number)
Sets the minimum font size of the web page.
Sets the minimum font size for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value| Description |
| ------ | -------- | ---- | ------ | ------------------------ |
| size | number | Yes | 8 | Minimum font size to set, in px. The value ranges from -2^31 to 2^31-1. In actual rendering, values greater than 72 are handled as 72, and values less than 1 are handled as 1. |
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State fontSize: number = 13
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.minFontSize(this.fontSize)
}
}
}
```
### minLogicalFontSize<sup>9+</sup>
minLogicalFontSize(size: number)
Sets the minimum logical font size for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value| Description |
| ------ | -------- | ---- | ------ | ------------------------ |
| size | number | Yes | 8 | Minimum font size of the web page. The value is a non-negative integer ranging from 1 to 72. If the value is less than 1, the value 1 is used. If the value is greater than 72, the value 72 is used.|
| size | number | Yes | 8 | Minimum logical font size to set, in px. The value ranges from -2^31 to 2^31-1. In actual rendering, values greater than 72 are handled as 72, and values less than 1 are handled as 1. |
**Example**
......@@ -786,27 +920,28 @@ Sets the minimum font size of the web page.
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State size: number = 13
@State fontSize: number = 13
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.minFontSize(this.size)
.minLogicalFontSize(this.fontSize)
}
}
}
```
### webFixedFont<sup>9+</sup>
webFixedFont(family: string)
Sets the fixed font family of the web page.
Sets the fixed font family for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | -------- | ---- | --------- | ---------------------------- |
| family | string | Yes | monospace | Fixed font family of the web page.|
| family | string | Yes | monospace | Fixed font family to set.|
**Example**
......@@ -831,13 +966,13 @@ Sets the fixed font family of the web page.
webSansSerifFont(family: string)
Sets the sans serif font family of the web page.
Sets the sans serif font family for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | -------- | ---- | ---------- | --------------------------------- |
| family | string | Yes | sans-serif | Sans serif font family of the web page.|
| family | string | Yes | sans-serif | Sans serif font family to set.|
**Example**
......@@ -862,13 +997,13 @@ Sets the sans serif font family of the web page.
webSerifFont(family: string)
Sets the serif font family of the web page.
Sets the serif font family for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value| Description |
| ------ | -------- | ---- | ------ | ---------------------------- |
| family | string | Yes | serif | Serif font family of the web page.|
| family | string | Yes | serif | Serif font family to set.|
**Example**
......@@ -893,13 +1028,13 @@ Sets the serif font family of the web page.
webStandardFont(family: string)
Sets the standard font family of the web page.
Sets the standard font family for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | -------- | ---- | ---------- | ------------------------------- |
| family | string | Yes | sans serif | Standard font family of the web page.|
| family | string | Yes | sans serif | Standard font family to set.|
**Example**
......@@ -924,13 +1059,13 @@ Sets the standard font family of the web page.
webFantasyFont(family: string)
Sets the fantasy font family of the web page.
Sets the fantasy font family for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | -------- | ---- | ------- | ------------------------------ |
| family | string | Yes | fantasy | Fantasy font family of the web page.|
| family | string | Yes | fantasy | Fantasy font family to set.|
**Example**
......@@ -955,13 +1090,13 @@ Sets the fantasy font family of the web page.
webCursiveFont(family: string)
Sets the cursive font family of the web page.
Sets the cursive font family for the web page.
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | -------- | ---- | ------- | ------------------------------ |
| family | string | Yes | cursive | Cursive font family of the web page.|
| family | string | Yes | cursive | Cursive font family to set.|
**Example**
......@@ -982,6 +1117,100 @@ Sets the cursive font family of the web page.
}
```
### darkMode<sup>9+</sup>
darkMode(mode: WebDarkMode)
Sets the web dark mode. By default, web dark mode is disabled. When it is enabled, the **\<Web>** component enables the dark theme defined for web pages if the theme has been defined in **prefer-color-scheme** of a media query, and remains unchanged otherwise. To enable the forcible dark mode, use this API with [forceDarkAccess](#forcedarkaccess9).
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | ----------- | ---- | --------------- | ------------------ |
| mode | [WebDarkMode](#webdarkmode9) | Yes | WebDarkMode.Off | Web dark mode to set.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State mode: WebDarkMode = WebDarkMode.On
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.darkMode(this.mode)
}
}
}
```
### forceDarkAccess<sup>9+</sup>
forceDarkAccess(access: boolean)
Sets whether to enable forcible dark mode for the web page. By default, this feature is turned off. This API is applicable only when dark mode is enabled in [darkMode](#darkmode9).
**Parameters**
| Name| Type| Mandatory| Default Value | Description |
| ------ | ------- | ---- | ----- | ------------------ |
| access | boolean | Yes | false | Whether to enable forcible dark mode for the web page.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State mode: WebDarkMode = WebDarkMode.On
@State access: boolean = true
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.darkMode(this.mode)
.forceDarkAccess(this.access)
}
}
}
```
### pinchSmooth<sup>9+</sup>
pinchSmooth(isEnabled: boolean)
Sets whether to enable smooth pinch mode for the web page.
**Parameters**
| Name | Type| Mandatory| Default Value| Description |
| --------- | -------- | ---- | ------ | -------------------------- |
| isEnabled | boolean | Yes | false | Whether to enable smooth pinch mode for the web page.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.pinchSmooth(true)
}
}
}
```
## Events
The universal events are not supported.
......@@ -998,7 +1227,7 @@ Triggered when **alert()** is invoked to display an alert dialog box on the web
| ------- | --------------------- | --------------- |
| url | string | URL of the web page where the dialog box is displayed.|
| message | string | Message displayed in the dialog box. |
| result | [JsResult](#jsresult) | The user's operation. |
| result | [JsResult](#jsresult) | User operation. |
**Return value**
......@@ -1056,7 +1285,7 @@ Triggered when this page is about to exit after the user refreshes or closes the
| ------- | --------------------- | --------------- |
| url | string | URL of the web page where the dialog box is displayed.|
| message | string | Message displayed in the dialog box. |
| result | [JsResult](#jsresult) | The user's operation. |
| result | [JsResult](#jsresult) | User operation. |
**Return value**
......@@ -1117,7 +1346,7 @@ Triggered when **confirm()** is invoked by the web page.
| ------- | --------------------- | --------------- |
| url | string | URL of the web page where the dialog box is displayed.|
| message | string | Message displayed in the dialog box. |
| result | [JsResult](#jsresult) | The user's operation. |
| result | [JsResult](#jsresult) | User operation. |
**Return value**
......@@ -1177,7 +1406,7 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul
| ------- | --------------------- | --------------- |
| url | string | URL of the web page where the dialog box is displayed.|
| message | string | Message displayed in the dialog box. |
| result | [JsResult](#jsresult) | The user's operation. |
| result | [JsResult](#jsresult) | User operation. |
**Return value**
......@@ -1361,7 +1590,7 @@ Triggered when an HTTP error (the response code is greater than or equal to 400)
| Name | Type | Description |
| ------- | ---------------------------------------- | --------------- |
| request | [WebResourceRequest](#webresourcerequest) | Encapsulation of a web page request. |
| error | [WebResourceError](#webresourceerror) | Encapsulation of a web page resource loading error.|
| response | [WebResourceResponse](#webresourceresponse) | Encapsulation of a resource response.|
**Example**
......@@ -1564,7 +1793,7 @@ Triggered when loading of the web page is complete. This API is used by an appli
}
```
### onRenderExited
### onRenderExited<sup>9+</sup>
onRenderExited(callback: (event?: { renderExitReason: RenderExitReason }) => void)
......@@ -1831,7 +2060,7 @@ Invoked when an HTTP authentication request is received.
| Name | Type | Description |
| ------- | ------------------------------------ | ---------------- |
| handler | [HttpAuthHandler](#httpauthhandler9) | The user's operation. |
| handler | [HttpAuthHandler](#httpauthhandler9) | User operation. |
| host | string | Host to which HTTP authentication credentials apply.|
| realm | string | Realm to which HTTP authentication credentials apply. |
......@@ -1900,7 +2129,7 @@ Invoked when an SSL error occurs during resource loading.
| Name | Type | Description |
| ------- | ------------------------------------ | -------------- |
| handler | [SslErrorHandler](#sslerrorhandler9) | The user's operation.|
| handler | [SslErrorHandler](#sslerrorhandler9) | User operation.|
| error | [SslError](#sslerror9) | Error code. |
**Example**
......@@ -1945,7 +2174,7 @@ Invoked when an SSL error occurs during resource loading.
### onClientAuthenticationRequest<sup>9+</sup>
onClientAuthenticationRequest(callback: (event: {handler : ClientAuthenticationHandler, host : string, port : number, keyTypes : Array\<string>, issuers : Array\<string>}) => void)
onClientAuthenticationRequest(callback: (event: {handler : ClientAuthenticationHandler, host : string, port : number, keyTypes : Array<string>, issuers : Array<string>}) => void)
Invoked when an SSL client certificate request is received.
......@@ -1953,11 +2182,11 @@ Invoked when an SSL client certificate request is received.
| Name | Type | Description |
| -------- | ---------------------------------------- | --------------- |
| handler | [ClientAuthenticationHandler](#clientauthenticationhandler9) | The user's operation. |
| handler | [ClientAuthenticationHandler](#clientauthenticationhandler9) | User operation. |
| host | string | Host name of the server that requests a certificate. |
| port | number | Port number of the server that requests a certificate. |
| keyTypes | Array\<string> | Acceptable asymmetric private key types. |
| issuers | Array\<string> | Issuer of the certificate that matches the private key.|
| keyTypes | Array<string> | Acceptable asymmetric private key types. |
| issuers | Array<string> | Issuer of the certificate that matches the private key.|
**Example**
```ts
......@@ -2008,7 +2237,7 @@ Invoked when a permission request is received.
| Name | Type | Description |
| ------- | ---------------------------------------- | -------------- |
| request | [PermissionRequest](#permissionrequest9) | The user's operation.|
| request | [PermissionRequest](#permissionrequest9) | User operation.|
**Example**
......@@ -2051,7 +2280,7 @@ Invoked when a permission request is received.
onContextMenuShow(callback: (event?: { param: WebContextMenuParam, result: WebContextMenuResult }) => boolean)
Invoked when a context menu is displayed upon a long press on a specific element (such as an image or link).
Shows a context menu after the user clicks the right mouse button or long presses a specific element, such as an image or a link.
**Parameters**
......@@ -2131,7 +2360,7 @@ Registers a callback for receiving a request to obtain the geolocation informati
| Name | Type | Description |
| ----------- | ------------------------------- | -------------- |
| origin | string | Index of the origin. |
| geolocation | [JsGeolocation](#jsgeolocation) | The user's operation.|
| geolocation | [JsGeolocation](#jsgeolocation) | User operation.|
**Example**
......@@ -2285,6 +2514,7 @@ Registers a callback for window creation.
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
......@@ -2626,7 +2856,7 @@ Notifies the **\<Web>** component of the user's confirm operation in the dialog
## FullScreenExitHandler<sup>9+</sup>
Implements a **FullScreenExitHandler** object for listening for exiting full screen mode. For the sample code, see onFullScreenEnter.
Implements a **FullScreenExitHandler** object for listening for exiting full screen mode. For the sample code, see [onFullScreenEnter](#onfullscreenenter9).
### exitFullScreen<sup>9+</sup>
......@@ -2830,15 +3060,15 @@ Obtains the MIME type of the resource response.
### setResponseData<sup>9+</sup>
setResponseData(data: string)
setResponseData(data: string | number)
Sets the data in the resource response.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ---- | ------ | ---- | ---- | ----------- |
| data | string | Yes | - | Resource response data to set.|
| Name| Type | Mandatory| Default Value| Description |
| ------ | ---------------- | ---- | ------ | ------------------------------------------------------------ |
| data | string \| number | Yes | - | Resource response data to set. When set to a number, the value indicates a file handle.|
### setResponseEncoding<sup>9+</sup>
......@@ -2900,6 +3130,18 @@ Sets the status code of the resource response.
| ---- | ------ | ---- | ---- | ------------- |
| code | number | Yes | - | Status code to set.|
### setResponseIsReady<sup>9+</sup>
setResponseIsReady(IsReady: boolean)
Sets whether the resource response data is ready.
**Parameters**
| Name | Type| Mandatory| Default Value| Description |
| ------- | -------- | ---- | ------ | -------------------------- |
| IsReady | boolean | Yes | true | Whether the resource response data is ready.|
## FileSelectorResult<sup>9+</sup>
Notifies the **\<Web>** component of the file selection result. For the sample code, see [onShowFileSelector](#onshowfileselector9).
......@@ -3098,11 +3340,46 @@ Grants the permission for resources requested by the web page.
| Name | Type | Mandatory | Default Value | Description |
| --------- | --------------- | ---- | ---- | ------------- |
| resources | Array\<string\> | Yes | - | List of accessible resources requested by the web page.|
| resources | Array\<string\> | Yes | - | List of resources that can be requested by the web page with the permission to grant.|
## ContextMenuSourceType<sup>9+</sup>
| Name | Description |
| -------------------- | ---------- |
| None | Other event sources. |
| Mouse | Mouse event. |
| LongPress | Long press event. |
## ContextMenuMediaType<sup>9+</sup>
| Name | Description |
| ------------ | ----------- |
| None | Non-special media or other media types.|
| Image | Image. |
## ContextMenuInputFieldType<sup>9+</sup>
| Name | Description |
| ------------ | ----------- |
| None | Non-input field. |
| PlainText | Plain text field, such as the text, search, or email field. |
| Password | Password field. |
| Number | Numeric field. |
| Telephone | Phone number field.|
| Other | Field of any other type. |
## ContextMenuEditStateFlags<sup>9+</sup>
| Name | Description |
| ------------ | ----------- |
| NONE | Editing is not allowed. |
| CAN_CUT | The cut operation is allowed. |
| CAN_COPY | The copy operation is allowed. |
| CAN_PASTE | The paste operation is allowed. |
| CAN_SELECT_ALL | The select all operation is allowed.|
## WebContextMenuParam<sup>9+</sup>
Provides the information about the context menu that is displayed when a page element is long pressed. For the sample code, see [onContextMenuShow](#oncontextmenushow9).
Implements a context menu, which is displayed after the user clicks the right mouse button or long presses a specific element, such as an image or a link. For the sample code, see [onContextMenuShow](#oncontextmenushow9).
### x<sup>9+</sup>
......@@ -3176,9 +3453,81 @@ Checks whether image content exists.
| ------- | ------------------------- |
| boolean | The value **true** means that there is image content in the element being long pressed, and **false** means the opposite.|
### getMediaType<sup>9+</sup>
getMediaType(): ContextMenuMediaType
Obtains the media type of this web page element.
**Return value**
| Type | Description |
| ---------------------------------------- | ----------- |
| [ContextMenuMediaType](#contextmenumediatype9) | Media type of the web page element.|
### getSelectionText<sup>9+</sup>
getSelectionText(): string
Obtains the selected text.
**Return value**
| Type | Description |
| ------- | ------------------------- |
| string | Selected text for the context menu. If no text is selected, null is returned.|
### getSourceType<sup>9+</sup>
getSourceType(): ContextMenuSourceType
Obtains the event source of the context menu.
**Return value**
| Type | Description |
| ---------------------------------------- | ----------- |
| [ContextMenuSourceType](#contextmenusourcetype9) | Event source of the context menu.|
### getInputFieldType<sup>9+</sup>
getInputFieldType(): ContextMenuInputFieldType
Obtains the input field type of this web page element.
**Return value**
| Type | Description |
| ---------------------------------------- | ----------- |
| [ContextMenuInputFieldType](#contextmenuinputfieldtype9) | Input field type.|
### isEditable<sup>9+</sup>
isEditable(): boolean
Checks whether this web page element is editable.
**Return value**
| Type | Description |
| ------- | ------------------------- |
| boolean | Returns **true** if the web page element is editable; returns **false** otherwise.|
### getEditStateFlags<sup>9+</sup>
getEditStateFlags(): number
Obtains the edit state flag of this web page element.
**Return value**
| Type | Description |
| ------- | ------------------------- |
| number | Edit state flag of the web page element. For details, see [ContextMenuEditStateFlags](#contextmenueditstateflags9).|
## WebContextMenuResult<sup>9+</sup>
Implements a **WebContextMenuResult** object. For the sample code, see onContextMenuShow.
Implements a **WebContextMenuResult** object. For the sample code, see [onContextMenuShow](#oncontextmenushow9).
### closeContextMenu<sup>9+</sup>
......@@ -3192,6 +3541,30 @@ copyImage(): void
Copies the image specified in **WebContextMenuParam**.
### copy<sup>9+</sup>
copy(): void
Performs the copy operation related to this context menu.
### paste<sup>9+</sup>
paste(): void
Performs the paste operation related to this context menu.
### cut<sup>9+</sup>
cut(): void
Performs the cut operation related to this context menu.
### selectAll<sup>9+</sup>
selectAll(): void
Performs the select all operation related to this context menu.
## JsGeolocation
Implements the **PermissionRequest** object. For the sample code, see [onGeolocationShow Event](#ongeolocationshow).
......@@ -3208,24 +3581,28 @@ Sets the geolocation permission status of a web page.
| ------ | ------- | ---- | ---- | ---------------------------------------- |
| origin | string | Yes | - | Index of the origin. |
| allow | boolean | Yes | - | Geolocation permission status. |
| retain | boolean | Yes | - | Whether the geolocation permission status can be saved to the system. The **[GeolocationPermissions](#geolocationpermissions9)** API can be used to manage the geolocation permission status saved to the system.|
| retain | boolean | Yes | - | Whether the geolocation permission status can be saved to the system. You can manage the geolocation permissions saved to the system through [GeolocationPermissions<sup>9+</sup>](../apis/js-apis-webview.md#geolocationpermissions).|
## WebController
Implements a **WebController** to control the behavior of the **\<Web>** component. A **WebController** can control only one **\<Web>** component, and the APIs in the **WebController** can be invoked only after it has been bound to the target **\<Web>** component.
This API is deprecated since API version 9. You are advised to use [WebviewController<sup>9+</sup>](../apis/js-apis-webview.md#webviewcontroller).
### Creating an Object
```
webController: WebController = new WebController()
```
### requestFocus
### requestFocus<sup>(deprecated)</sup>
requestFocus()
Requests focus for this web page.
This API is deprecated since API version 9. You are advised to use [requestFocus<sup>9+</sup>](../apis/js-apis-webview.md#requestfocus).
**Example**
```ts
......@@ -3247,12 +3624,14 @@ Requests focus for this web page.
}
```
### accessBackward
### accessBackward<sup>(deprecated)</sup>
accessBackward(): boolean
Checks whether going to the previous page can be performed on the current page.
This API is deprecated since API version 9. You are advised to use [accessBackward<sup>9+</sup>](../apis/js-apis-webview.md#accessbackward).
**Return value**
| Type | Description |
......@@ -3281,12 +3660,14 @@ Checks whether going to the previous page can be performed on the current page.
}
```
### accessForward
### accessForward<sup>(deprecated)</sup>
accessForward(): boolean
Checks whether going to the next page can be performed on the current page.
This API is deprecated since API version 9. You are advised to use [accessForward<sup>9+</sup>](../apis/js-apis-webview.md#accessforward).
**Return value**
| Type | Description |
......@@ -3315,12 +3696,14 @@ Checks whether going to the next page can be performed on the current page.
}
```
### accessStep
### accessStep<sup>(deprecated)</sup>
accessStep(step: number): boolean
Performs a specific number of steps forward or backward from the current page.
This API is deprecated since API version 9. You are advised to use [accessStep<sup>9+</sup>](../apis/js-apis-webview.md#accessstep).
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
......@@ -3356,12 +3739,14 @@ Performs a specific number of steps forward or backward from the current page.
}
```
### backward
### backward<sup>(deprecated)</sup>
backward(): void
Goes to the previous page based on the history stack. This API is generally used together with **accessBackward**.
This API is deprecated since API version 9. You are advised to use [backward<sup>9+</sup>](../apis/js-apis-webview.md#backward).
**Example**
```ts
......@@ -3383,12 +3768,14 @@ Goes to the previous page based on the history stack. This API is generally used
}
```
### forward
### forward<sup>(deprecated)</sup>
forward(): void
Goes to the next page based on the history stack. This API is generally used together with **accessForward**.
This API is deprecated since API version 9. You are advised to use [forward<sup>9+</sup>](../apis/js-apis-webview.md#forward).
**Example**
```ts
......@@ -3444,12 +3831,14 @@ Performs a specific number of steps forward or backward on the current page base
}
```
### deleteJavaScriptRegister
### deleteJavaScriptRegister<sup>(deprecated)</sup>
deleteJavaScriptRegister(name: string)
Deletes a specific application JavaScript object that is registered with the window through **registerJavaScriptProxy**. The deletion takes effect immediately, with no need for invoking the [refresh](#refresh) API.
This API is deprecated since API version 9. You are advised to use [deleteJavaScriptRegister<sup>9+</sup>](../apis/js-apis-webview.md#deletejavascriptregister).
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
......@@ -3478,12 +3867,14 @@ Deletes a specific application JavaScript object that is registered with the win
}
```
### getHitTest
### getHitTest<sup>(deprecated)</sup>
getHitTest(): HitTestType
Obtains the element type of the area being clicked.
This API is deprecated since API version 9. You are advised to use [getHitTest<sup>9+</sup>](../apis/js-apis-webview.md#gethittest).
**Return value**
| Type | Description |
......@@ -3678,7 +4069,7 @@ Obtains the default user agent of the current web page.
}
```
### loadData
### loadData<sup>(deprecated)</sup>
loadData(options: { data: string, mimeType: string, encoding: string, baseUrl?: string, historyUrl?: string })
......@@ -3688,6 +4079,8 @@ If **baseUrl** is set to a data URL, the encoded string will be loaded by the **
If **baseUrl** is set to an HTTP or HTTPS URL, the encoded string will be processed by the **\<Web>** component as a non-encoded string in a manner similar to **loadUrl**.
This API is deprecated since API version 9. You are advised to use [loadData<sup>9+</sup>](../apis/js-apis-webview.md#loaddata).
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
......@@ -3723,7 +4116,7 @@ If **baseUrl** is set to an HTTP or HTTPS URL, the encoded string will be proces
}
```
### loadUrl
### loadUrl<sup>(deprecated)</sup>
loadUrl(options: { url: string | Resource, headers?: Array\<Header\> })
......@@ -3733,6 +4126,8 @@ The object injected through **loadUrl** is valid only in the current document. I
The object injected through **registerJavaScriptProxy** is still valid on a new page redirected through **loadUrl**.
This API is deprecated since API version 9. You are advised to use [loadUrl<sup>9+</sup>](../apis/js-apis-webview.md#loadurl).
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
......@@ -3761,12 +4156,14 @@ The object injected through **registerJavaScriptProxy** is still valid on a new
}
```
### onActive
### onActive<sup>(deprecated)</sup>
onActive(): void
Invoked when the **\<Web>** component enters the active state.
This API is deprecated since API version 9. You are advised to use [onActive<sup>9+</sup>](../apis/js-apis-webview.md#onactive).
**Example**
```ts
......@@ -3788,12 +4185,14 @@ Invoked when the **\<Web>** component enters the active state.
}
```
### onInactive
### onInactive<sup>(deprecated)</sup>
onInactive(): void
Invoked when the **\<Web>** component enters the inactive state.
This API is deprecated since API version 9. You are advised to use [onInactive<sup>9+</sup>](../apis/js-apis-webview.md#oninactive).
**Example**
```ts
......@@ -3815,11 +4214,13 @@ Invoked when the **\<Web>** component enters the inactive state.
}
```
### zoom
### zoom<sup>(deprecated)</sup>
zoom(factor: number): void
Sets a zoom factor for the current web page.
This API is deprecated since API version 9. You are advised to use [zoom<sup>9+</sup>](../apis/js-apis-webview.md#zoom).
**Parameters**
| Name | Type | Mandatory | Description |
......@@ -3914,12 +4315,14 @@ Zooms out of this web page by 20%.
}
```
### refresh
### refresh<sup>(deprecated)</sup>
refresh()
Invoked when the **\<Web>** component refreshes the web page.
This API is deprecated since API version 9. You are advised to use [refresh<sup>9+</sup>](../apis/js-apis-webview.md#refresh).
**Example**
```ts
......@@ -3941,11 +4344,13 @@ Invoked when the **\<Web>** component refreshes the web page.
}
```
### registerJavaScriptProxy
### registerJavaScriptProxy<sup>(deprecated)</sup>
registerJavaScriptProxy(options: { object: object, name: string, methodList: Array\<string\> })
Registers a JavaScript object and invokes the methods of the object in the window. You must invoke the [refresh](#refresh) API for the registration to take effect.
Registers a JavaScript object with the window. APIs of this object can then be invoked in the window. You must invoke the [refresh](#refresh) API for the registration to take effect.
This API is deprecated since API version 9. You are advised to use [registerJavaScriptProxy<sup>9+</sup>](../apis/js-apis-webview.md#registerjavascriptproxy).
**Parameters**
......@@ -4007,12 +4412,14 @@ Registers a JavaScript object and invokes the methods of the object in the windo
```
### runJavaScript
### runJavaScript<sup>(deprecated)</sup>
runJavaScript(options: { script: string, callback?: (result: string) => void })
Executes a JavaScript script. This API uses an asynchronous callback to return the script execution result. **runJavaScript** can be invoked only after **loadUrl** is executed. For example, it can be invoked in **onPageEnd**.
This API is deprecated since API version 9. You are advised to use [runJavaScript<sup>9+</sup>](../apis/js-apis-webview.md#runjavascript).
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
......@@ -4066,12 +4473,14 @@ Executes a JavaScript script. This API uses an asynchronous callback to return t
```
### stop
### stop<sup>(deprecated)</sup>
stop()
Stops page loading.
This API is deprecated since API version 9. You are advised to use [stop<sup>9+</sup>](../apis/js-apis-webview.md#stop).
**Example**
```ts
......@@ -4093,12 +4502,14 @@ Stops page loading.
}
```
### clearHistory
### clearHistory<sup>(deprecated)</sup>
clearHistory(): void
Clears the browsing history.
This API is deprecated since API version 9. You are advised to use [clearHistory<sup>9+</sup>](../apis/js-apis-webview.md#clearhistory).
**Example**
```ts
......@@ -4626,7 +5037,7 @@ Obtains the cookie value corresponding to the specified URL.
Column() {
Button('getCookie')
.onClick(() => {
let value = webview.WebCookieManager.getCookie('www.example.com')
let value = web_webview.WebCookieManager.getCookie('www.example.com')
console.log("value: " + value)
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -4676,44 +5087,10 @@ Sets a cookie value for the specified URL.
}
```
### saveCookieSync<sup>9+</sup>
saveCookieSync(): boolean
Saves the cookies in the memory to the drive. This API returns the result synchronously.
**Return value**
| Type | Description |
| ------- | -------------------- |
| boolean | Operation result.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('saveCookieSync')
.onClick(() => {
let result = web_webview.WebCookieManager.saveCookieSync()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### saveCookieAsync<sup>9+</sup>
saveCookieAsync(): Promise\<boolean>
Saves cookies in the memory to the drive. This API uses a promise to return the value.
Saves the cookies in the memory to the drive. This API uses a promise to return the value.
**Return value**
......@@ -4752,7 +5129,7 @@ Saves cookies in the memory to the drive. This API uses a promise to return the
### saveCookieAsync<sup>9+</sup>
saveCookieAsync(callback: AsyncCallback\<boolean>): void
Saves cookies in the memory to the drive. This API uses an asynchronous callback to return the result.
Saves the cookies in the memory to the drive. This API uses an asynchronous callback to return the result.
**Parameters**
......@@ -4998,158 +5375,7 @@ Deletes all session cookies.
Column() {
Button('deleteSessionCookie')
.onClick(() => {
webview.WebCookieManager.deleteSessionCookie()
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
## WebDataBase<sup>9+</sup>
Implements the **WebDataBase** object.
### existHttpAuthCredentials<sup>9+</sup>
static existHttpAuthCredentials(): boolean
Checks whether any saved HTTP authentication credentials exist. This API returns the result synchronously.
**Return value**
| Type | Description |
| ------- | ---------------------------------------- |
| boolean | Whether any saved HTTP authentication credentials exist. Returns **true** if any saved HTTP authentication credentials exist exists; returns **false** otherwise.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('existHttpAuthCredentials')
.onClick(() => {
let result = web_webview.WebDataBase.existHttpAuthCredentials()
console.log('result: ' + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### deleteHttpAuthCredentials<sup>9+</sup>
static deleteHttpAuthCredentials(): void
Deletes all HTTP authentication credentials saved in the cache. This API returns the result synchronously.
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('deleteHttpAuthCredentials')
.onClick(() => {
web_webview.WebDataBase.deleteHttpAuthCredentials()
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### getHttpAuthCredentials<sup>9+</sup>
static getHttpAuthCredentials(host: string, realm: string): Array\<string\>
Retrieves HTTP authentication credentials for a given host and realm. This API returns the result synchronously.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ----- | ------ | ---- | ---- | ---------------- |
| host | string | Yes | - | Host to which HTTP authentication credentials apply.|
| realm | string | Yes | - | Realm to which HTTP authentication credentials apply. |
**Return value**
| Type | Description |
| --------------- | ---------------------- |
| Array\<string\> | Returns the array of the matching user names and passwords if the operation is successful; returns an empty array otherwise.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
host: string = "www.spincast.org"
realm: string = "protected example"
username_password: string[]
build() {
Column() {
Button('getHttpAuthCredentials')
.onClick(() => {
this.username_password = web_webview.WebDataBase.getHttpAuthCredentials(this.host, this.realm)
console.log('num: ' + this.username_password.length)
ForEach(this.username_password, (item) => {
console.log('username_password: ' + item)
}, item => item)
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### saveHttpAuthCredentials<sup>9+</sup>
static saveHttpAuthCredentials(host: string, realm: string, username: string, password: string): void
Saves HTTP authentication credentials for a given host and realm. This API returns the result synchronously.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| -------- | ------ | ---- | ---- | ---------------- |
| host | string | Yes | - | Host to which HTTP authentication credentials apply.|
| realm | string | Yes | - | Realm to which HTTP authentication credentials apply. |
| username | string | Yes | - | User name. |
| password | string | Yes | - | Password. |
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
host: string = "www.spincast.org"
realm: string = "protected example"
build() {
Column() {
Button('saveHttpAuthCredentials')
.onClick(() => {
web_webview.WebDataBase.saveHttpAuthCredentials(this.host, this.realm, "Stromgol", "Laroche")
web_webview.WebCookieManager.deleteSessionCookie()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -5157,783 +5383,88 @@ Saves HTTP authentication credentials for a given host and realm. This API retur
}
```
## GeolocationPermissions<sup>9+</sup>
Implements a **GeolocationPermissions** object.
### allowGeolocation<sup>9+</sup>
static allowGeolocation(origin: string): void
Allows the specified origin to use the geolocation information.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ------ | ------ | ---- | ---- | ---------- |
| origin | string | Yes | - | Index of the origin.|
**Example**
## MessageLevel
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('allowGeolocation')
.onClick(() => {
web_webview.GeolocationPermissions.allowGeolocation(this.origin)
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
| Name | Description |
| ----- | :---- |
| Debug | Debug level.|
| Error | Error level.|
| Info | Information level.|
| Log | Log level.|
| Warn | Warning level. |
### deleteGeolocation<sup>9+</sup>
## RenderExitReason
static deleteGeolocation(origin: string): void
Enumerates the reasons why the rendering process exits.
Clears the geolocation permission status of a specified origin.
| Name | Description |
| -------------------------- | ----------------- |
| ProcessAbnormalTermination | The rendering process exits abnormally. |
| ProcessWasKilled | The rendering process receives a SIGKILL message or is manually terminated.|
| ProcessCrashed | The rendering process crashes due to segmentation or other errors. |
| ProcessOom | The program memory is running low. |
| ProcessExitUnknown | Other reason. |
**Parameters**
## MixedMode
| Name | Type | Mandatory | Default Value | Description |
| ------ | ------ | ---- | ---- | ---------- |
| origin | string | Yes | - | Index of the origin.|
| Name | Description |
| ---------- | ---------------------------------- |
| All | HTTP and HTTPS hybrid content can be loaded. This means that all insecure content can be loaded.|
| Compatible | HTTP and HTTPS hybrid content can be loaded in compatibility mode. This means that some insecure content may be loaded. |
| None | HTTP and HTTPS hybrid content cannot be loaded. |
**Example**
## CacheMode
| Name | Description |
| ------- | ------------------------------------ |
| Default | The cache that has not expired is used to load the resources. If the resources do not exist in the cache, they will be obtained from the Internet.|
| None | The cache is used to load the resources. If the resources do not exist in the cache, they will be obtained from the Internet. |
| Online | The cache is not used to load the resources. All resources are obtained from the Internet. |
| Only | The cache alone is used to load the resources. |
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('deleteGeolocation')
.onClick(() => {
web_webview.GeolocationPermissions.deleteGeolocation(this.origin)
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
## FileSelectorMode
| Name | Description |
| -------------------- | ---------- |
| FileOpenMode | Open and upload a file. |
| FileOpenMultipleMode | Open and upload multiple files. |
| FileOpenFolderMode | Open and upload a folder.|
| FileSaveMode | Save a file. |
### deleteAllGeolocation<sup>9+</sup>
## HitTestType
static deleteAllGeolocation(): void
| Name | Description |
| ------------- | ------------------------ |
| EditText | Editable area. |
| Email | Email address. |
| HttpAnchor | Hyperlink whose **src** is **http**. |
| HttpAnchorImg | Image with a hyperlink, where **src** is **http**.|
| Img | HTML::img tag. |
| Map | Geographical address. |
| Phone | Phone number. |
| Unknown | Unknown content. |
Clears the geolocation permission status of all sources.
## SslError<sup>9+</sup>
**Example**
Enumerates the error codes returned by **onSslErrorEventReceive** API.
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('deleteAllGeolocation')
.onClick(() => {
web_webview.GeolocationPermissions.deleteAllGeolocation()
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
| Name | Description |
| ------------ | ----------- |
| Invalid | Minor error. |
| HostMismatch | The host name does not match. |
| DateInvalid | The certificate has an invalid date. |
| Untrusted | The certificate issuer is not trusted.|
### getAccessibleGeolocation<sup>9+</sup>
## ProtectedResourceType<sup>9+</sup>
static getAccessibleGeolocation(origin: string, callback: AsyncCallback\<boolean\>): void
| Name | Description | Remarks |
| --------- | ------------- | -------------------------- |
| MidiSysex | MIDI SYSEX resource.| Currently, only permission events can be reported. MIDI devices are not yet supported.|
Obtains the geolocation permission status of the specified source. This API uses an asynchronous callback to return the result.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| -------- | ------------------------ | ---- | ---- | ---------------------------------------- |
| origin | string | Yes | - | Index of the origin. |
| callback | AsyncCallback\<boolean\> | Yes | - | Callback used to return the geolocation permission status of the specified source. If the operation is successful, the value **true** means that the geolocation permission is granted, and **false** means the opposite. If the operation fails, the geolocation permission status of the specified source is not found.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('getAccessibleGeolocationAsync')
.onClick(() => {
web_webview.GeolocationPermissions.getAccessibleGeolocation(this.origin, (error, result) => {
if (error) {
console.log('getAccessibleGeolocationAsync error: ' + JSON.stringify(error))
return
}
console.log('getAccessibleGeolocationAsync result: ' + result)
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### getAccessibleGeolocation<sup>9+</sup>
static getAccessibleGeolocation(origin: string): Promise\<boolean\>
Obtains the geolocation permission status of the specified source. This API uses a promise to return the result.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ------ | ------ | ---- | ---- | ---------- |
| origin | string | Yes | - | Index of the origin.|
**Return value**
| Type | Description |
| ------------------ | ---------------------------------------- |
| Promise\<boolean\> | Promise used to return the geolocation permission status of the specified source. If the operation is successful, the value **true** means that the geolocation permission is granted, and **false** means the opposite. If the operation fails, the geolocation permission status of the specified source is not found.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('getAccessibleGeolocationPromise')
.onClick(() => {
web_webview.GeolocationPermissions.getAccessibleGeolocation(this.origin).then(result => {
console.log('getAccessibleGeolocationPromise result: ' + result)
}).catch(error => {
console.log('getAccessibleGeolocationPromise error: ' + JSON.stringify(error))
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### getStoredGeolocation<sup>9+</sup>
static getStoredGeolocation(callback: AsyncCallback\<Array\<string\>\>): void
Obtains the geolocation permission status of all sources. This API uses an asynchronous callback to return the result.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| -------- | -------------------------------- | ---- | ---- | -------------------- |
| callback | AsyncCallback\<Array\<string\>\> | Yes | - | Callback used to return the geolocation permission status of all sources.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('getStoredGeolocationAsync')
.onClick(() => {
web_webview.GeolocationPermissions.getStoredGeolocation((error, origins) => {
if (error) {
console.log('getStoredGeolocationAsync error: ' + JSON.stringify(error))
return
}
let origins_str: string = origins.join()
console.log('getStoredGeolocationAsync origins: ' + origins_str)
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### getStoredGeolocation<sup>9+</sup>
static getStoredGeolocation(): Promise\<Array\<string\>\>
Obtains the geolocation permission status of all sources. This API uses a promise to return the result.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| -------- | -------------------------------- | ---- | ---- | -------------------- |
| callback | AsyncCallback\<Array\<string\>\> | Yes | - | Callback used to return the geolocation permission status of all sources.|
**Return value**
| Type | Description |
| -------------------------- | -------------------------------- |
| Promise\<Array\<string\>\> | Promise used to return the geolocation permission status of all sources.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('getStoredGeolocationPromise')
.onClick(() => {
web_webview.GeolocationPermissions.getStoredGeolocation().then(origins => {
let origins_str: string = origins.join()
console.log('getStoredGeolocationPromise origins: ' + origins_str)
}).catch(error => {
console.log('getStoredGeolocationPromise error: ' + JSON.stringify(error))
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
## WebStorage<sup>9+</sup>
Implements the **WebStorage** object, which can be used to manage the Web SQL and the HTML5 Web Storage API. All **\<Web>** components in an application share one **WebStorage**.
### deleteAllData<sup>9+</sup>
static deleteAllData(): void
Deletes all data in the Web SQL Database.
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('deleteAllData')
.onClick(() => {
web_webview.WebStorage.deleteAllData()
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### deleteOrigin<sup>9+</sup>
static deleteOrigin(origin : string): void
Deletes all data in the specified origin.
**Parameters**
| Name | Type | Mandatory | Description |
| ------ | ------ | ---- | ---------- |
| origin | string | Yes | Index of the origin.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getHttpAuthCredentials')
.onClick(() => {
web_webview.WebStorage.deleteOrigin(this.origin)
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### getOrigins<sup>9+</sup>
static getOrigins(callback: AsyncCallback\<Array\<WebStorageOrigin>>) : void
Obtains information about all origins that are currently using the Web SQL Database. This API uses an asynchronous callback to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| -------- | ---------------------------------------- | ---- | ----------------------------------- |
| callback | AsyncCallback<Array<[WebStorageOrigin](#webstorageorigin9)>> | Yes | Callback used to return the information about the origins. For details, see **WebStorageOrigin**.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getOrigins')
.onClick(() => {
web_webview.WebStorage.getOrigins((error, origins) => {
if (error) {
console.log('error: ' + error)
return
}
for (let i = 0; i < origins.length; i++) {
console.log('origin: ' + origins[i].origin)
console.log('usage: ' + origins[i].usage)
console.log('quota: ' + origins[i].quota)
}
})
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### getOrigins<sup>9+</sup>
static getOrigins() : Promise\<Array\<WebStorageOrigin>>
Obtains information about all origins that are currently using the Web SQL Database. This API uses a promise to return the result.
**Return value**
| Type | Description |
| ---------------------------------------- | ---------------------------------------- |
| Promise<Array<[WebStorageOrigin](#webstorageorigin9)>> | Promise used to return the information about the origins. For details, see **WebStorageOrigin**.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getOrigins')
.onClick(() => {
web_webview.WebStorage.getOrigins()
.then(origins => {
for (let i = 0; i < origins.length; i++) {
console.log('origin: ' + origins[i].origin)
console.log('usage: ' + origins[i].usage)
console.log('quota: ' + origins[i].quota)
}
})
.catch(error => {
console.log('error: ' + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### getOriginQuota<sup>9+</sup>
static getOriginQuota(origin : string, callback : AsyncCallback\<number>) : void
Obtains the storage quota of an origin in the Web SQL Database, in bytes. This API uses an asynchronous callback to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| -------- | ---------------------- | ---- | --------- |
| origin | string | Yes | Index of the origin.|
| callback | AsyncCallback\<number> | Yes | Callback used to return the storage quota of the origin.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getOriginQuota')
.onClick(() => {
web_webview.WebStorage.getOriginQuota(this.origin, (error, quota) => {
if (error) {
console.log('error: ' + error)
return
}
console.log('quota: ' + quota)
})
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### getOriginQuota<sup>9+</sup>
static getOriginQuota(origin : string) : Promise\<number>
Obtains the storage quota of an origin in the Web SQL Database, in bytes. This API uses a promise to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| ------ | ------ | ---- | ---------- |
| origin | string | Yes | Index of the origin.|
**Return value**
| Type | Description |
| ---------------- | ----------------------- |
| Promise\<number> | Promise used to return the storage quota of the origin.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin"
build() {
Column() {
Button('getOriginQuota')
.onClick(() => {
web_webview.WebStorage.getOriginQuota(this.origin)
.then(quota => {
console.log('quota: ' + quota)
})
.catch(error => {
console.log('error: ' + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### getOriginUsage<sup>9+</sup>
static getOriginUsage(origin : string, callback : AsyncCallback\<number>) : void
Obtains the storage usage of an origin in the Web SQL Database, in bytes. This API uses an asynchronous callback to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| -------- | ---------------------- | ---- | ---------- |
| origin | string | Yes | Index of the origin.|
| callback | AsyncCallback\<number> | Yes | Callback used to return the storage usage of the origin. |
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin"
build() {
Column() {
Button('getOriginUsage')
.onClick(() => {
web_webview.WebStorage.getOriginUsage(this.origin, (error, usage) => {
if (error) {
console.log('error: ' + error)
return
}
console.log('usage: ' + usage)
})
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
### getOriginUsage<sup>9+</sup>
static getOriginUsage(origin : string) : Promise\<number>
Obtains the storage usage of an origin in the Web SQL Database, in bytes. This API uses a promise to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| ------ | ------ | ---- | ---------- |
| origin | string | Yes | Index of the origin.|
**Return value**
| Type | Description |
| ---------------- | ---------------------- |
| Promise\<number> | Promise used to return the storage usage of the origin.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin"
build() {
Column() {
Button('getOriginQuota')
.onClick(() => {
web_webview.WebStorage.getOriginUsage(this.origin)
.then(usage => {
console.log('usage: ' + usage)
})
.catch(error => {
console.log('error: ' + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
}
}
}
```
## WebStorageOrigin<sup>9+</sup>
Provides usage information about the Web SQL Database.
**Parameters**
| Name | Type | Mandatory | Description |
| ------ | ------ | ---- | ---------- |
| origin | string | Yes | Index of the origin.|
| usage | number | Yes | Storage usage of the origin. |
| quota | number | Yes | Storage quota of the origin. |
## MessageLevel
| Name | Description |
| ----- | :---- |
| Debug | Debug level.|
| Error | Error level.|
| Info | Information level.|
| Log | Log level.|
| Warn | Warning level. |
## RenderExitReason
Enumerates the reasons why the rendering process exits.
| Name | Description |
| -------------------------- | ----------------- |
| ProcessAbnormalTermination | The rendering process exits abnormally. |
| ProcessWasKilled | The rendering process receives a SIGKILL message or is manually terminated.|
| ProcessCrashed | The rendering process crashes due to segmentation or other errors. |
| ProcessOom | The program memory is running low. |
| ProcessExitUnknown | Other reason. |
## MixedMode
| Name | Description |
| ---------- | ---------------------------------- |
| All | HTTP and HTTPS hybrid content can be loaded. This means that all insecure content can be loaded.|
| Compatible | HTTP and HTTPS hybrid content can be loaded in compatibility mode. This means that some insecure content may be loaded. |
| None | HTTP and HTTPS hybrid content cannot be loaded. |
## CacheMode
## WebDarkMode<sup>9+</sup>
| Name | Description |
| ------- | ------------------------------------ |
| Default | The cache that has not expired is used to load the resources. If the resources do not exist in the cache, they will be obtained from the Internet.|
| None | The cache is used to load the resources. If the resources do not exist in the cache, they will be obtained from the Internet. |
| Online | The cache is not used to load the resources. All resources are obtained from the Internet. |
| Only | The cache alone is used to load the resources. |
## FileSelectorMode
| Name | Description |
| -------------------- | ---------- |
| FileOpenMode | Open and upload a file. |
| FileOpenMultipleMode | Open and upload multiple files. |
| FileOpenFolderMode | Open and upload a folder.|
| FileSaveMode | Save a file. |
## HitTestType
| Name | Description |
| ------------- | ------------------------ |
| EditText | Editable area. |
| Email | Email address. |
| HttpAnchor | Hyperlink whose **src** is **http**. |
| HttpAnchorImg | Image with a hyperlink, where **src** is **http**.|
| Img | HTML::img tag. |
| Map | Geographical address. |
| Phone | Phone number. |
| Unknown | Unknown content. |
## SslError<sup>9+</sup>
Enumerates the error codes returned by **onSslErrorEventReceive** API.
| Name | Description |
| ------------ | ----------- |
| Invalid | Minor error. |
| HostMismatch | The host name does not match. |
| DateInvalid | The certificate has an invalid date. |
| Untrusted | The certificate issuer is not trusted.|
## ProtectedResourceType<sup>9+</sup>
| Name | Description | Remarks |
| --------- | ------------- | -------------------------- |
| MidiSysex | MIDI SYSEX resource.| Currently, only permission events can be reported. MIDI devices are not yet supported.|
## WebAsyncController
Implements the **WebAsyncController** object, which can be used to control the behavior of a **\<Web>** component with asynchronous callbacks. A **WebAsyncController **object controls one **\<Web>** component.
### Creating an Object
```
webController: WebController = new WebController();
webAsyncController: WebAsyncController = new WebAsyncController(webController);
```
### storeWebArchive<sup>9+</sup>
storeWebArchive(baseName: string, autoName: boolean, callback: AsyncCallback<string>): void
Stores this web page. This API uses an asynchronous callback to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| -------- | ---------------------------------------- | ---- | ----------------------------------- |
| baseName | string | Yes| Save path. The value cannot be null.
| autoName | boolean | Yes| Whether to automatically generate a file name.<br>The value **false** means not to automatically generate a file name.<br>The value **true** means to automatically generate a file name based on the URL of current page and the **baseName** value. In this case, **baseName** is regarded as a directory.
| callback | AsyncCallback<string> | Yes | Callback used to return the save path if the operation is successful and null otherwise.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
build() {
Column() {
Button('saveWebArchive')
.onClick(() => {
let webAsyncController = new web_webview.WebAsyncController(this.controller)
webAsyncController.storeWebArchive("/data/storage/el2/base/", true, (filename) => {
if (filename != null) {
console.info(`save web archive success: ${filename}`)
}
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
### storeWebArchive<sup>9+</sup>
storeWebArchive(baseName: string, autoName: boolean): Promise<string>
Stores this web page. This API uses a promise to return the result.
**Parameters**
| Name | Type | Mandatory | Description |
| -------- | ---------------------------------------- | ---- | ----------------------------------- |
| baseName | string | Yes| Save path. The value cannot be null.
| autoName | boolean | Yes| Whether to automatically generate a file name.<br>The value **false** means not to automatically generate a file name.<br>The value **true** means to automatically generate a file name based on the URL of current page and the **baseName** value. In this case, **baseName** is regarded as a directory.
**Return value**
| Type | Description |
| --------------- | -------------------------------- |
| Promise<string> | Promise used to return the save path if the operation is successful and null otherwise.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
build() {
Column() {
Button('saveWebArchive')
.onClick(() => {
let webAsyncController = new web_webview.WebAsyncController(this.controller);
webAsyncController.storeWebArchive("/data/storage/el2/base/", true)
.then(filename => {
if (filename != null) {
console.info(`save web archive success: ${filename}`)
}
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
}
}
```
| Off | The web dark mode is disabled. |
| On | The web dark mode is enabled. |
| Auto | The web dark mode setting follows the system settings. |
## WebMessagePort<sup>9+</sup>
......@@ -6158,7 +5689,7 @@ Sets the message port in this object. For the complete sample code, see [postMes
## DataResubmissionHandler<sup>9+</sup>
Implements the **DataResubmissionHandler** for resubmitting or canceling the web form data.
Implements the **DataResubmissionHandler** object for resubmitting or canceling the web form data.
### resend<sup>9+</sup>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册