Skip to content

D
Docs

OpenHarmony / Docs
大约 2 年 前同步成功

通知 161
Star 293
Fork 28
D
Docs
提交 c3a5a8cd 编写于 作者: E ester.zhou
浏览文件
操作

Update docs (16882) 

Signed-off-by: Nester.zhou <ester.zhou@huawei.com>
上级 ea0af727
显示空白变更内容
内联 并排
Showing with 140 addition and 35 deletion
en/application-dev/reference/apis/js-apis-webview.md
浏览文件 @ c3a5a8cd
...@@ -81,7 +81,7 @@ import web_webview from '@ohos.web.webview' ...@@ -81,7 +81,7 @@ import web_webview from '@ohos.web.webview'
@Component @Component
struct WebComponent { struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController(); controller: web_webview.WebviewController = new web_webview.WebviewController();
msgPort: WebMessagePort[] = null; msgPort: web_webview.WebMessagePort[] = null;
build() { build() {
Column() { Column() {
...@@ -1121,7 +1121,7 @@ Executes a JavaScript script. This API uses a promise to return the script execu ...@@ -1121,7 +1121,7 @@ Executes a JavaScript script. This API uses a promise to return the script execu
| Type | Description | | Type | Description |
| --------------- | --------------------------------------------------- | | --------------- | --------------------------------------------------- |
| Promise\<string> | Promise used to return the result. Returns **null** if the JavaScript script fails to be executed| | Promise\<string> | Promise used to return the result if the operation is successful and null otherwise.|
**Error codes** **Error codes**
...@@ -2106,7 +2106,7 @@ Stores this web page. This API uses an asynchronous callback to return the resul ...@@ -2106,7 +2106,7 @@ Stores this web page. This API uses an asynchronous callback to return the resul
| Name | Type | Mandatory| Description | | Name | Type | Mandatory| Description |
| -------- | --------------------- | ---- | ------------------------------------------------------------ | | -------- | --------------------- | ---- | ------------------------------------------------------------ |
| baseName | string | Yes | Save path. The value cannot be null. | | baseName | string | Yes | Save path. The value cannot be null. |
| autoName | boolean | Yes | Whether to automatically generate a file name. The value **false** means not to automatically generate a file name. 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.| | autoName | boolean | Yes | Whether to automatically generate a file name. The value **false** means not to automatically generate a file name. The value **true** means to automatically generate a file name based on the URL of the 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. | | callback | AsyncCallback\<string> | Yes | Callback used to return the save path if the operation is successful and null otherwise. |
**Error codes** **Error codes**
...@@ -2131,7 +2131,7 @@ struct WebComponent { ...@@ -2131,7 +2131,7 @@ struct WebComponent {
build() { build() {
Column() { Column() {
Button('saveWebArchive') Button('storeWebArchive')
.onClick(() => { .onClick(() => {
try { try {
this.controller.storeWebArchive("/data/storage/el2/base/", true, (error, filename) => { this.controller.storeWebArchive("/data/storage/el2/base/", true, (error, filename) => {
...@@ -2166,7 +2166,7 @@ Stores this web page. This API uses a promise to return the result. ...@@ -2166,7 +2166,7 @@ Stores this web page. This API uses a promise to return the result.
| Name | Type| Mandatory| Description | | Name | Type| Mandatory| Description |
| -------- | -------- | ---- | ------------------------------------------------------------ | | -------- | -------- | ---- | ------------------------------------------------------------ |
| baseName | string | Yes | Save path. The value cannot be null. | | baseName | string | Yes | Save path. The value cannot be null. |
| autoName | boolean | Yes | Whether to automatically generate a file name. The value **false** means not to automatically generate a file name. 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.| | autoName | boolean | Yes | Whether to automatically generate a file name. The value **false** means not to automatically generate a file name. The value **true** means to automatically generate a file name based on the URL of the current page and the **baseName** value. In this case, **baseName** is regarded as a directory.|
**Return value** **Return value**
...@@ -2196,7 +2196,7 @@ struct WebComponent { ...@@ -2196,7 +2196,7 @@ struct WebComponent {
build() { build() {
Column() { Column() {
Button('saveWebArchive') Button('storeWebArchive')
.onClick(() => { .onClick(() => {
try { try {
this.controller.storeWebArchive("/data/storage/el2/base/", true) this.controller.storeWebArchive("/data/storage/el2/base/", true)
...@@ -2317,6 +2317,8 @@ backOrForward(step: number): void ...@@ -2317,6 +2317,8 @@ backOrForward(step: number): void
Performs a specific number of steps forward or backward on the current page based on the history stack. No redirection will be performed if the corresponding page does not exist in the history stack. Performs a specific number of steps forward or backward on the current page based on the history stack. No redirection will be performed if the corresponding page does not exist in the history stack.
Because the previously loaded web pages are used for the operation, no page reloading is involved.
**System capability**: SystemCapability.Web.Webview.Core **System capability**: SystemCapability.Web.Webview.Core
**Parameters** **Parameters**
...@@ -3055,10 +3057,11 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error ...@@ -3055,10 +3057,11 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error
**Example** **Example**
1. To perform operations on files, you must import the file management module. For details, see [File Management](./js-apis-file-fs.md).
```ts ```ts
// xxx.ets // xxx.ets
import web_webview from '@ohos.web.webview'; import web_webview from '@ohos.web.webview';
import fileio from '@ohos.fileio'; import fs from '@ohos.file.fs';
@Entry @Entry
@Component @Component
...@@ -3071,11 +3074,13 @@ struct WebComponent { ...@@ -3071,11 +3074,13 @@ struct WebComponent {
.onClick(() => { .onClick(() => {
try { try {
let state = this.controller.serializeWebState(); let state = this.controller.serializeWebState();
let path = globalThis.AbilityContext.cacheDir; // Obtain the value of globalThis.cacheDir from MainAbility.ts.
let path = globalThis.cacheDir;
path += '/WebState'; path += '/WebState';
let fd = fileio.openSync(path, 0o2 | 0o100, 0o666); // Synchronously open a file.
fileio.writeSync(fd, state.buffer); let file = fs.openSync(path, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
fileio.closeSync(fd); fs.writeSync(file.fd, state.buffer);
fs.closeSync(file.fd);
} catch (error) { } catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`); console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
} }
...@@ -3086,6 +3091,21 @@ struct WebComponent { ...@@ -3086,6 +3091,21 @@ struct WebComponent {
} }
``` ```
2. Modify **MainAbility.ts**.
Obtain the path of the application cache file.
```ts
// xxx.ts
import UIAbility from '@ohos.app.ability.UIAbility';
import web_webview from '@ohos.web.webview';
export default class MainAbility extends UIAbility {
onCreate(want, launchParam) {
// Bind cacheDir to the globalThis object to implement data synchronization between the UIAbility component and the page.
globalThis.cacheDir = this.context.cacheDir;
}
}
```
### restoreWebState ### restoreWebState
restoreWebState(state: Uint8Array): void restoreWebState(state: Uint8Array): void
...@@ -3110,10 +3130,11 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error ...@@ -3110,10 +3130,11 @@ For details about the error codes, see [Webview Error Codes](../errorcodes/error
**Example** **Example**
1. To perform operations on files, you must import the file management module. For details, see [File Management](./js-apis-file-fs.md).
```ts ```ts
// xxx.ets // xxx.ets
import web_webview from '@ohos.web.webview'; import web_webview from '@ohos.web.webview';
import fileio from '@ohos.fileio'; import fs from '@ohos.file.fs';
@Entry @Entry
@Component @Component
...@@ -3125,17 +3146,22 @@ struct WebComponent { ...@@ -3125,17 +3146,22 @@ struct WebComponent {
Button('RestoreWebState') Button('RestoreWebState')
.onClick(() => { .onClick(() => {
try { try {
let path = globalThis.AbilityContext.cacheDir; // Obtain the value of globalThis.cacheDir from MainAbility.ts.
let path = globalThis.cacheDir;
path += '/WebState'; path += '/WebState';
let fd = fileio.openSync(path, 0o002, 0o666); // Synchronously open a file.
let stat = fileio.fstatSync(fd); let file = fs.openSync(path, fs.OpenMode.READ_WRITE);
let stat = fs.statSync(path);
let size = stat.size; let size = stat.size;
let buf = new ArrayBuffer(size); let buf = new ArrayBuffer(size);
fileio.read(fd, buf, (err, data) => { fs.read(file.fd, buf, (err, readLen) => {
if (data) { if (err) {
this.controller.restoreWebState(new Uint8Array(data.buffer)); console.info("mkdir failed with error message: " + err.message + ", error code: " + err.code);
} else {
console.info("read file data succeed");
this.controller.restoreWebState(new Uint8Array(buf.slice(0, readLen)));
fs.closeSync(file);
} }
fileio.closeSync(fd);
}); });
} catch (error) { } catch (error) {
console.error(`ErrorCode: ${error.code}, Message: ${error.message}`); console.error(`ErrorCode: ${error.code}, Message: ${error.message}`);
...@@ -3147,6 +3173,21 @@ struct WebComponent { ...@@ -3147,6 +3173,21 @@ struct WebComponent {
} }
``` ```
2. Modify **MainAbility.ts**.
Obtain the path of the application cache file.
```ts
// xxx.ts
import UIAbility from '@ohos.app.ability.UIAbility';
import web_webview from '@ohos.web.webview';
export default class MainAbility extends UIAbility {
onCreate(want, launchParam) {
// Bind cacheDir to the globalThis object to implement data synchronization between the UIAbility component and the page.
globalThis.cacheDir = this.context.cacheDir;
}
}
```
### customizeSchemes ### customizeSchemes
static customizeSchemes(schemes: Array\<WebCustomScheme\>): void static customizeSchemes(schemes: Array\<WebCustomScheme\>): void
...@@ -3204,7 +3245,7 @@ Implements a **WebCookieManager** instance to manage behavior of cookies in **\< ...@@ -3204,7 +3245,7 @@ Implements a **WebCookieManager** instance to manage behavior of cookies in **\<
static getCookie(url: string): string static getCookie(url: string): string
Obtains the cookie value corresponding to the specified URL. Obtains the cookie corresponding to the specified URL.
**System capability**: SystemCapability.Web.Webview.Core **System capability**: SystemCapability.Web.Webview.Core
...@@ -3212,7 +3253,7 @@ Obtains the cookie value corresponding to the specified URL. ...@@ -3212,7 +3253,7 @@ Obtains the cookie value corresponding to the specified URL.
| Name| Type | Mandatory| Description | | Name| Type | Mandatory| Description |
| ------ | ------ | ---- | :------------------------ | | ------ | ------ | ---- | :------------------------ |
| url | string | Yes | URL of the cookie value to obtain. A complete URL is recommended.| | url | string | Yes | URL of the cookie to obtain. A complete URL is recommended.|
**Return value** **Return value**
...@@ -3260,7 +3301,7 @@ struct WebComponent { ...@@ -3260,7 +3301,7 @@ struct WebComponent {
static setCookie(url: string, value: string): void static setCookie(url: string, value: string): void
Sets a cookie value for the specified URL. Sets a cookie for the specified URL.
**System capability**: SystemCapability.Web.Webview.Core **System capability**: SystemCapability.Web.Webview.Core
...@@ -3453,7 +3494,7 @@ Checks whether the **WebCookieManager** instance has the permission to send and ...@@ -3453,7 +3494,7 @@ Checks whether the **WebCookieManager** instance has the permission to send and
| Type | Description | | Type | Description |
| ------- | -------------------------------- | | ------- | -------------------------------- |
| boolean | Whether the **WebCookieManager** instance has the permission to send and receive cookies.| | boolean | Whether the **WebCookieManager** instance has the permission to send and receive cookies. The default value is **true**.|
**Example** **Example**
...@@ -3532,7 +3573,7 @@ Checks whether the **WebCookieManager** instance has the permission to send and ...@@ -3532,7 +3573,7 @@ Checks whether the **WebCookieManager** instance has the permission to send and
| Type | Description | | Type | Description |
| ------- | -------------------------------------- | | ------- | -------------------------------------- |
| boolean | Whether the **WebCookieManager** instance has the permission to send and receive third-party cookies.| | boolean | Whether the **WebCookieManager** instance has the permission to send and receive third-party cookies. The default value is **false**.|
**Example** **Example**
......
en/application-dev/reference/arkui-ts/ts-basic-components-web.md
浏览文件 @ c3a5a8cd
...@@ -28,7 +28,7 @@ Web(options: { src: ResourceStr, controller: WebviewController | WebController}) ...@@ -28,7 +28,7 @@ Web(options: { src: ResourceStr, controller: WebviewController | WebController})
| Name | Type | Mandatory | Description | | Name | Type | Mandatory | Description |
| ---------- | ---------------------------------------- | ---- | ------- | | ---------- | ---------------------------------------- | ---- | ------- |
| src | [ResourceStr](ts-types.md) | Yes | Address of a web page resource. To access local resource files, use the **$rawfile** or **resource** protocol. To load a local resource file in the sandbox outside of the application package, use **file://** to specify the path of the sandbox.| | src | [ResourceStr](ts-types.md) | Yes | Address of a web page resource. To load a local resource file in the sandbox outside of the application package, use **file://** to specify the path of the sandbox.|
| controller | [WebviewController<sup>9+</sup>](../apis/js-apis-webview.md#webviewcontroller) \| [WebController](#webcontroller) | Yes | Controller. **WebController** is deprecated since API version 9. You are advised to use **WebviewController** instead.| | controller | [WebviewController<sup>9+</sup>](../apis/js-apis-webview.md#webviewcontroller) \| [WebController](#webcontroller) | Yes | Controller. **WebController** is deprecated since API version 9. You are advised to use **WebviewController** instead.|
**Example** **Example**
...@@ -68,6 +68,7 @@ Web(options: { src: ResourceStr, controller: WebviewController | WebController}) ...@@ -68,6 +68,7 @@ Web(options: { src: ResourceStr, controller: WebviewController | WebController})
``` ```
Example of loading local resource files in the sandbox: Example of loading local resource files in the sandbox:
1. Use [globalthis](../../application-models/uiability-data-sync-with-ui.md#using-globalthis-between-uiability-and-page) to obtain the path of the sandbox. 1. Use [globalthis](../../application-models/uiability-data-sync-with-ui.md#using-globalthis-between-uiability-and-page) to obtain the path of the sandbox.
```ts ```ts
// xxx.ets // xxx.ets
...@@ -518,7 +519,7 @@ multiWindowAccess(multiWindow: boolean) ...@@ -518,7 +519,7 @@ multiWindowAccess(multiWindow: boolean)
Sets whether to enable the multi-window permission. Sets whether to enable the multi-window permission.
Enabling the multi-window permission requires implementation of the **onWindowNew** event. For details about the sample code, see [onWindowNew](#onwindownew9). Enabling the multi-window permission requires implementation of the **onWindowNew** event. For the sample code, see [onWindowNew](#onwindownew9).
**Parameters** **Parameters**
...@@ -684,6 +685,40 @@ Sets the cache mode. ...@@ -684,6 +685,40 @@ Sets the cache mode.
} }
``` ```
### textZoomAtio<sup>(deprecated)</sup>
textZoomAtio(textZoomAtio: number)
Sets the text zoom ratio of the page. The default value is **100**, which indicates 100%.
This API is deprecated since API version 9. You are advised to use [textZoomRatio<sup>9+</sup>](#textzoomratio9) instead.
**Parameters**
| Name | Type | Mandatory | Default Value | Description |
| ------------- | ------ | ---- | ---- | --------------- |
| textZoomAtio | number | Yes | 100 | Text zoom ratio to set.|
**Example**
```ts
// xxx.ets
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController()
@State atio: number = 150
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.textZoomAtio(this.atio)
}
}
}
```
### textZoomRatio<sup>9+</sup> ### textZoomRatio<sup>9+</sup>
textZoomRatio(textZoomRatio: number) textZoomRatio(textZoomRatio: number)
...@@ -1801,7 +1836,7 @@ Called when loading of the web page is complete. This API is used by an applicat ...@@ -1801,7 +1836,7 @@ Called when loading of the web page is complete. This API is used by an applicat
| Name | Type | Description | | Name | Type | Description |
| ----------- | ------- | ---------------------------------------- | | ----------- | ------- | ---------------------------------------- |
| url | string | URL to be accessed. | | url | string | URL to be accessed. |
| isRefreshed | boolean | Whether the page is reloaded. The value **true** means that the page is reloaded by invoking the [refresh](#refresh) API, and **false** means the opposite.| | isRefreshed | boolean | Whether the page is reloaded. The value **true** means that the page is reloaded by invoking the [refresh<sup>9+</sup>](../apis/js-apis-webview.md#refresh) API, and **false** means the opposite.|
**Example** **Example**
...@@ -1986,7 +2021,7 @@ Called when the display ratio of this page changes. ...@@ -1986,7 +2021,7 @@ Called when the display ratio of this page changes.
} }
``` ```
### onUrlLoadIntercept ### onUrlLoadIntercept<sup>(deprecated)</sup>
onUrlLoadIntercept(callback: (event?: { data:string | WebResourceRequest }) => boolean) onUrlLoadIntercept(callback: (event?: { data:string | WebResourceRequest }) => boolean)
...@@ -2326,7 +2361,7 @@ Called when a permission request is received. ...@@ -2326,7 +2361,7 @@ Called when a permission request is received.
onContextMenuShow(callback: (event?: { param: WebContextMenuParam, result: WebContextMenuResult }) => boolean) onContextMenuShow(callback: (event?: { param: WebContextMenuParam, result: WebContextMenuResult }) => boolean)
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. Called when a context menu is displayed after the user clicks the right mouse button or long presses a specific element, such as an image or a link.
**Parameters** **Parameters**
...@@ -2403,7 +2438,7 @@ Called when the scrollbar of the page scrolls. ...@@ -2403,7 +2438,7 @@ Called when the scrollbar of the page scrolls.
onGeolocationShow(callback: (event?: { origin: string, geolocation: JsGeolocation }) => void) onGeolocationShow(callback: (event?: { origin: string, geolocation: JsGeolocation }) => void)
Registers a callback for receiving a request to obtain the geolocation information. Called when a request to obtain the geolocation information is received.
**Parameters** **Parameters**
...@@ -2605,6 +2640,7 @@ If opening a new window is not needed, set the parameter to **null** when callin ...@@ -2605,6 +2640,7 @@ If opening a new window is not needed, set the parameter to **null** when callin
.javaScriptAccess(true) .javaScriptAccess(true)
// MultiWindowAccess needs to be enabled. // MultiWindowAccess needs to be enabled.
.multiWindowAccess(true) .multiWindowAccess(true)
.allowWindowOpenMethod(true)
.onWindowNew((event) => { .onWindowNew((event) => {
if (this.dialogController) { if (this.dialogController) {
this.dialogController.close() this.dialogController.close()
...@@ -2861,7 +2897,7 @@ Called when this web page receives a new favicon. ...@@ -2861,7 +2897,7 @@ Called when this web page receives a new favicon.
Column() { Column() {
Web({ src:'www.example.com', controller: this.controller }) Web({ src:'www.example.com', controller: this.controller })
.onFaviconReceived((event) => { .onFaviconReceived((event) => {
console.log('onFaviconReceived:' + JSON.stringify(event)) console.log('onFaviconReceived');
this.icon = event.favicon; this.icon = event.favicon;
}) })
} }
...@@ -2869,6 +2905,34 @@ Called when this web page receives a new favicon. ...@@ -2869,6 +2905,34 @@ Called when this web page receives a new favicon.
} }
``` ```
### onRequestSelected
onRequestSelected(callback: () => void)
Called when the **\<Web>** component obtains the focus.
**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 })
.onRequestSelected(() => {
console.log('onRequestSelected')
})
}
}
}
```
## ConsoleMessage ## ConsoleMessage
Implements the **ConsoleMessage** object. For the sample code, see [onConsole](#onconsole). Implements the **ConsoleMessage** object. For the sample code, see [onConsole](#onconsole).
...@@ -2923,7 +2987,7 @@ Obtains the path and name of the web page source file. ...@@ -2923,7 +2987,7 @@ Obtains the path and name of the web page source file.
## JsResult ## JsResult
Implements the **JsResult** object, which indicates the result returned to the **\<Web>** component to indicate the user operation performed in the dialog box. For the sample code, see [onAlert Event](#onalert). Implements the **JsResult** object, which indicates the result returned to the **\<Web>** component to indicate the user operation performed in the dialog box. For the sample code, see [onAlert](#onalert).
### handleCancel ### handleCancel
...@@ -3853,7 +3917,7 @@ Obtains the cookie management object of the **\<Web>** component. ...@@ -3853,7 +3917,7 @@ Obtains the cookie management object of the **\<Web>** component.
| Type | Description | | Type | Description |
| --------- | ---------------------------------------- | | --------- | ---------------------------------------- |
| WebCookie | Cookie management object. For details, see [WebCookie](#webcookie).| | WebCookie | Cookie management object. For details, see [WebCookie](#webcookiedeprecated).|
**Example** **Example**
...@@ -4082,7 +4146,7 @@ This API is deprecated since API version 9. You are advised to use [forward<sup> ...@@ -4082,7 +4146,7 @@ This API is deprecated since API version 9. You are advised to use [forward<sup>
deleteJavaScriptRegister(name: string) 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. 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](#refreshdeprecated) API.
This API is deprecated since API version 9. You are advised to use [deleteJavaScriptRegister<sup>9+</sup>](../apis/js-apis-webview.md#deletejavascriptregister). This API is deprecated since API version 9. You are advised to use [deleteJavaScriptRegister<sup>9+</sup>](../apis/js-apis-webview.md#deletejavascriptregister).
...@@ -4363,7 +4427,7 @@ This API is deprecated since API version 9. You are advised to use [refresh<sup> ...@@ -4363,7 +4427,7 @@ This API is deprecated since API version 9. You are advised to use [refresh<sup>
registerJavaScriptProxy(options: { object: object, name: string, methodList: Array\<string\> }) registerJavaScriptProxy(options: { object: object, name: string, methodList: Array\<string\> })
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. Registers a JavaScript object with the window. APIs of this object can then be invoked in the window. You must invoke the [refresh](#refreshdeprecated) 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). This API is deprecated since API version 9. You are advised to use [registerJavaScriptProxy<sup>9+</sup>](../apis/js-apis-webview.md#registerjavascriptproxy).
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或