鸿蒙Harmony应用开发—ArkTS声明式开发(基础手势:Web)下篇

onRequestSelected

onRequestSelected(callback: () => void)

当Web组件获得焦点时触发该回调。

示例:

// 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')
        })
    }
  }
}

onScreenCaptureRequest10+

onScreenCaptureRequest(callback: (event?: { handler: ScreenCaptureHandler }) => void)

通知收到屏幕捕获请求。

参数:

参数名参数类型参数描述
handlerScreenCaptureHandler通知Web组件用户操作行为。

示例:

// 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 })
        .onScreenCaptureRequest((event) => {
          if (event) {
            AlertDialog.show({
              title: 'title: ' + event.handler.getOrigin(),
              message: 'text',
              primaryButton: {
                value: 'deny',
                action: () => {
                  event.handler.deny()
                }
              },
              secondaryButton: {
                value: 'onConfirm',
                action: () => {
                  event.handler.grant({ captureMode: WebCaptureMode.HOME_SCREEN })
                }
              },
              cancel: () => {
                event.handler.deny()
              }
            })
          }
        })
    }
  }
}

onOverScroll10+

onOverScroll(callback: (event: {xOffset: number, yOffset: number}) => void)

通知网页过滚动偏移量。

参数:

参数名参数类型参数描述
xOffsetnumber以网页最左端为基准,水平过滚动偏移量。
yOffsetnumber以网页最上端为基准,竖直过滚动偏移量。

示例:

// 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 })
      .onOverScroll((event) => {
          console.info("x = " + event.xOffset)
          console.info("y = " + event.yOffset)
      })
    }
  }
}

onControllerAttached10+

onControllerAttached(callback: () => void)

当Controller成功绑定到Web组件时触发该回调,并且该Controller必须为WebviewController, 因该回调调用时网页还未加载,无法在回调中使用有关操作网页的接口,例如zoomInzoomOut等,可以使用loadUrlgetWebId等操作网页不相关的接口。

示例:

在该回调中使用loadUrl加载网页

// 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: '', controller: this.controller })
        .onControllerAttached(() => {
          this.controller.loadUrl($rawfile("index.html"));
        })
    }
  }
}

在该回调中使用getWebId

// xxx.ets
import web_webview from '@ohos.web.webview'
import { BusinessError } from '@ohos.base';

@Entry
@Component
struct WebComponent {
  controller: web_webview.WebviewController = new web_webview.WebviewController()

  build() {
    Column() {
      Web({ src: $rawfile("index.html"), controller: this.controller })
        .onControllerAttached(() => {
          try {
            let id = this.controller.getWebId();
            console.log("id: " + id);
          } catch (error) {
            let code = (error as BusinessError).code;
            let message = (error as BusinessError).message;
            console.error(`ErrorCode: ${code},  Message: ${message}`);
          }
        })
    }
  }
}

加载的html文件。

<!-- index.html -->
<!DOCTYPE html>
<html>
    <body>
        <p>Hello World</p>
    </body>
</html>

onNavigationEntryCommitted11+

onNavigationEntryCommitted(callback: OnNavigationEntryCommittedCallback)

当网页跳转提交时触发该回调。

参数:

参数名类型说明
callbackOnNavigationEntryCommittedCallback网页跳转提交时触发的回调。

示例:

// 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 })
      .onNavigationEntryCommitted((details) => {
          console.log("onNavigationEntryCommitted: [isMainFrame]= " + details.isMainFrame +
            ", [isSameDocument]=" + details.isSameDocument +
            ", [didReplaceEntry]=" + details.didReplaceEntry +
            ", [navigationType]=" + details.navigationType +
            ", [url]=" + details.url);
      })
    }
  }
}

onSafeBrowsingCheckResult11+

onSafeBrowsingCheckResult(callback: OnSafeBrowsingCheckResultCallback)

收到网站安全风险检查结果时触发的回调。

参数:

参数名类型说明
callbackOnSafeBrowsingCheckResultCallback收到网站安全风险检查结果时触发的回调。

示例:

// xxx.ets
import web_webview from '@ohos.web.webview'

export enum ThreatType {
  UNKNOWN = -1,
  THREAT_ILLEGAL = 0,
  THREAT_FRAUD = 1,
  THREAT_RISK = 2,
  THREAT_WARNING = 3,
}

export class OnSafeBrowsingCheckResultCallback {
  threatType: ThreatType = ThreatType.UNKNOWN;
}

@Entry
@Component
struct WebComponent {
  controller: web_webview.WebviewController = new web_webview.WebviewController()
  build() {
    Column() {
      Web({ src: 'www.example.com', controller: this.controller })
      .onSafeBrowsingCheckResult((callback) => {
          let jsonData = JSON.stringify(callback)
          let json:OnSafeBrowsingCheckResultCallback = JSON.parse(jsonData)
          console.log("onSafeBrowsingCheckResult: [threatType]= " + json.threatType);
      })
    }
  }
}

onNativeEmbedLifecycleChange11+

onNativeEmbedLifecycleChange(callback: NativeEmbedDataInfo)

当Embed标签生命周期变化时触发该回调。

参数:

参数名类型说明
eventNativeEmbedDataInfoEmbed标签生命周期变化时触发该回调。

示例:

// xxx.ets
import web_webview from '@ohos.web.webview'

@Entry
@Component
struct WebComponent {
  @State embedStatus: string = ''
  controller: web_webview.WebviewController = new web_webview.WebviewController()
  build() {
    Column() {
      Web({ src: 'www.example.com', controller: this.controller })
      .onNativeEmbedLifecycleChange((event) => {
          if (event.status == NativeEmbedStatus.CREATE) {
            this.embedStatus = 'Create'
          }
          if (event.status == NativeEmbedStatus.UPDATE) {
            this.embedStatus = 'Update'
          }
          if (event.status == NativeEmbedStatus.DESTROY) {
            this.embedStatus = 'Destroy'
          }
          console.log("status = " + this.embedStatus);
          console.log("surfaceId = " + event.surfaceId);
          console.log("embedId = " + event.embedId);
          if(event.info){
            console.log("id = " + event.info.id);
            console.log("type = " + event.info.type);
            console.log("src = " + event.info.src);
            console.log("width = " + event.info.width);
            console.log("height = " + event.info.height);
            console.log("url = " + event.info.url);
          }
      })
    }
  }
}

onNativeEmbedGestureEvent11+

onNativeEmbedGestureEvent(callback: NativeEmbedTouchInfo)

当手指触摸到Embed标签时触发该回调。

参数:

参数名类型说明
eventNativeEmbedTouchInfo手指触摸到Embed标签时触发该回调。

示例:

// xxx.ets
import web_webview from '@ohos.web.webview'

@Entry
@Component
struct WebComponent {
  @State eventType: string = ''
  controller: web_webview.WebviewController = new web_webview.WebviewController()
  build() {
    Column() {
      Web({ src: 'www.example.com', controller: this.controller })
      .onNativeEmbedGestureEvent((event) => {
        if (event && event.touchEvent){
          if (event.touchEvent.type == TouchType.Down) {
            this.eventType = 'Down'
          }
          if (event.touchEvent.type == TouchType.Up) {
            this.eventType = 'Up'
          }
          if (event.touchEvent.type == TouchType.Move) {
            this.eventType = 'Move'
          }
          if (event.touchEvent.type == TouchType.Cancel) {
            this.eventType = 'Cancel'
          }
          console.log("embedId = " + event.embedId);
          console.log("touchType = " + this.eventType);
          console.log("x = " + event.touchEvent.touches[0].x);
          console.log("y = " + event.touchEvent.touches[0].y);
          console.log("Component globalPos:(" + event.touchEvent.target.area.globalPosition.x + "," + event.touchEvent.target.area.globalPosition.y + ")");
          console.log("width = " + event.touchEvent.target.area.width);
          console.log("height = " + event.touchEvent.target.area.height);
        }
      })
    }
  }
}

ConsoleMessage

Web组件获取控制台信息对象。示例代码参考onConsole事件

getLineNumber

getLineNumber(): number

获取ConsoleMessage的行数。

返回值:

类型说明
number返回ConsoleMessage的行数。

getMessage

getMessage(): string

获取ConsoleMessage的日志信息。

返回值:

类型说明
string返回ConsoleMessage的日志信息。

getMessageLevel

getMessageLevel(): MessageLevel

获取ConsoleMessage的信息级别。

返回值:

类型说明
MessageLevel返回ConsoleMessage的信息级别。

getSourceId

getSourceId(): string

获取网页源文件路径和名字。

返回值:

类型说明
string返回网页源文件路径和名字。

JsResult

Web组件返回的弹窗确认或弹窗取消功能对象。示例代码参考onAlert事件

handleCancel

handleCancel(): void

通知Web组件用户取消弹窗操作。

handleConfirm

handleConfirm(): void

通知Web组件用户确认弹窗操作。

handlePromptConfirm9+

handlePromptConfirm(result: string): void

通知Web组件用户确认弹窗操作及对话框内容。

参数:

参数名参数类型必填默认值参数描述
resultstring-用户输入的对话框内容。

FullScreenExitHandler9+

通知开发者Web组件退出全屏。示例代码参考onFullScreenEnter事件

constructor9+

constructor()

exitFullScreen9+

exitFullScreen(): void

通知开发者Web组件退出全屏。

ControllerHandler9+

设置用户新建web组件的的WebviewController对象。示例代码参考onWindowNew事件

setWebController9+

setWebController(controller: WebviewController): void

设置WebviewController对象,如果不需要打开新窗口请设置为null。

参数:

参数名参数类型必填默认值参数描述
controllerWebviewController-新建web组件的WebviewController对象,如果不需要打开新窗口请设置为null。

WebResourceError

web组件资源管理错误信息对象。示例代码参考onErrorReceive事件

getErrorCode

getErrorCode(): number

获取加载资源的错误码。

返回值:

类型说明
number返回加载资源的错误码。

getErrorInfo

getErrorInfo(): string

获取加载资源的错误信息。

返回值:

类型说明
string返回加载资源的错误信息。

WebResourceRequest

web组件获取资源请求对象。示例代码参考onErrorReceive事件

getRequestHeader

getRequestHeader(): Array<Header>

获取资源请求头信息。

返回值:

类型说明
Array<Header>返回资源请求头信息。

getRequestUrl

getRequestUrl(): string

获取资源请求的URL信息。

返回值:

类型说明
string返回资源请求的URL信息。

isMainFrame

isMainFrame(): boolean

判断资源请求是否为主frame。

返回值:

类型说明
boolean返回资源请求是否为主frame。

isRedirect

isRedirect(): boolean

判断资源请求是否被服务端重定向。

返回值:

类型说明
boolean返回资源请求是否被服务端重定向。

isRequestGesture

isRequestGesture(): boolean

获取资源请求是否与手势(如点击)相关联。

返回值:

类型说明
boolean返回资源请求是否与手势(如点击)相关联。

getRequestMethod9+

getRequestMethod(): string

获取请求方法。

返回值:

类型说明
string返回请求方法。

Header

Web组件返回的请求/响应头对象。

名称类型描述
headerKeystring请求/响应头的key。
headerValuestring请求/响应头的value。

WebResourceResponse

web组件资源响应对象。示例代码参考onHttpErrorReceive事件

getReasonMessage

getReasonMessage(): string

获取资源响应的状态码描述。

返回值:

类型说明
string返回资源响应的状态码描述。

getResponseCode

getResponseCode(): number

获取资源响应的状态码。

返回值:

类型说明
number返回资源响应的状态码。

getResponseData

getResponseData(): string

获取资源响应数据。

返回值:

类型说明
string返回资源响应数据。

getResponseEncoding

getResponseEncoding(): string

获取资源响应的编码。

返回值:

类型说明
string返回资源响应的编码。

getResponseHeader

getResponseHeader() : Array<Header>

获取资源响应头。

返回值:

类型说明
Array<Header>返回资源响应头。

getResponseMimeType

getResponseMimeType(): string

获取资源响应的媒体(MIME)类型。

返回值:

类型说明
string返回资源响应的媒体(MIME)类型。

setResponseData9+

setResponseData(data: string | number | Resource)

设置资源响应数据。

参数:

参数名参数类型必填默认值参数描述
datastring | number | Resource10+-要设置的资源响应数据。string表示HTML格式的字符串。number表示文件句柄, 此句柄由系统的Web组件负责关闭。 Resource表示应用rawfile目录下文件资源。

setResponseEncoding9+

setResponseEncoding(encoding: string)

设置资源响应的编码。

参数:

参数名参数类型必填默认值参数描述
encodingstring-要设置的资源响应的编码。

setResponseMimeType9+

setResponseMimeType(mimeType: string)

设置资源响应的媒体(MIME)类型。

参数:

参数名参数类型必填默认值参数描述
mimeTypestring-要设置的资源响应的媒体(MIME)类型。

setReasonMessage9+

setReasonMessage(reason: string)

设置资源响应的状态码描述。

参数:

参数名参数类型必填默认值参数描述
reasonstring-要设置的资源响应的状态码描述。

setResponseHeader9+

setResponseHeader(header: Array<Header>)

设置资源响应头。

参数:

参数名参数类型必填默认值参数描述
headerArray<Header>-要设置的资源响应头。

setResponseCode9+

setResponseCode(code: number)

设置资源响应的状态码。

参数:

参数名参数类型必填默认值参数描述
codenumber-要设置的资源响应的状态码。

setResponseIsReady9+

setResponseIsReady(IsReady: boolean)

设置资源响应数据是否已经就绪。

参数:

参数名参数类型必填默认值参数描述
IsReadybooleantrue资源响应数据是否已经就绪。

FileSelectorResult9+

通知Web组件的文件选择结果。示例代码参考onShowFileSelector事件

handleFileList9+

handleFileList(fileList: Array<string>): void

通知Web组件进行文件选择操作。

参数:

参数名参数类型必填默认值参数描述
fileListArray<string>-需要进行操作的文件列表。

FileSelectorParam9+

web组件获取文件对象。示例代码参考onShowFileSelector事件

getTitle9+

getTitle(): string

获取文件选择器标题。

返回值:

类型说明
string返回文件选择器标题。

getMode9+

getMode(): FileSelectorMode

获取文件选择器的模式。

返回值:

类型说明
FileSelectorMode返回文件选择器的模式。

getAcceptType9+

getAcceptType(): Array<string>

获取文件过滤类型。

返回值:

类型说明
Array<string>返回文件过滤类型。

isCapture9+

isCapture(): boolean

获取是否调用多媒体能力。

返回值:

类型说明
boolean返回是否调用多媒体能力。

HttpAuthHandler9+

Web组件返回的http auth认证请求确认或取消和使用缓存密码认证功能对象。示例代码参考onHttpAuthRequest事件

cancel9+

cancel(): void

通知Web组件用户取消HTTP认证操作。

confirm9+

confirm(userName: string, password: string): boolean

使用用户名和密码进行HTTP认证操作。

参数:

参数名参数类型必填默认值参数描述
userNamestring-HTTP认证用户名。
passwordstring-HTTP认证密码。

返回值:

类型说明
boolean认证成功返回true,失败返回false。

isHttpAuthInfoSaved9+

isHttpAuthInfoSaved(): boolean

通知Web组件用户使用服务器缓存的帐号密码认证。

返回值:

类型说明
boolean存在密码认证成功返回true,其他返回false。

SslErrorHandler9+

Web组件返回的SSL错误通知事件用户处理功能对象。示例代码参考onSslErrorEventReceive事件

handleCancel9+

handleCancel(): void

通知Web组件取消此请求。

handleConfirm9+

handleConfirm(): void

通知Web组件继续使用SSL证书。

ClientAuthenticationHandler9+

Web组件返回的SSL客户端证书请求事件用户处理功能对象。示例代码参考onClientAuthenticationRequest事件

confirm9+

confirm(priKeyFile : string, certChainFile : string): void

通知Web组件使用指定的私钥和客户端证书链。

参数:

参数名参数类型必填参数描述
priKeyFilestring存放私钥的文件,包含路径和文件名。
certChainFilestring存放证书链的文件,包含路径和文件名。

confirm10+

confirm(authUri : string): void

需要权限: ohos.permission.ACCESS_CERT_MANAGER

通知Web组件使用指定的凭据(从证书管理模块获得)。

参数:

参数名参数类型必填参数描述
authUristring凭据的关键值。

cancel9+

cancel(): void

通知Web组件取消相同host和port服务器发送的客户端证书请求事件。同时,相同host和port服务器的请求,不重复上报该事件。

ignore9+

ignore(): void

通知Web组件忽略本次请求。

PermissionRequest9+

Web组件返回授权或拒绝权限功能的对象。示例代码参考onPermissionRequest事件

deny9+

deny(): void

拒绝网页所请求的权限。

getOrigin9+

getOrigin(): string

获取网页来源。

返回值:

类型说明
string当前请求权限网页的来源。

getAccessibleResource9+

getAccessibleResource(): Array<string>

获取网页所请求的权限资源列表,资源列表类型参考ProtectedResourceType

返回值:

类型说明
Array<string>网页所请求的权限资源列表。

grant9+

grant(resources: Array<string>): void

对网页访问的给定权限进行授权。

参数:

参数名参数类型必填默认值参数描述
resourcesArray<string>-授予网页请求的权限的资源列表。

ScreenCaptureHandler10+

Web组件返回授权或拒绝屏幕捕获功能的对象。示例代码参考onScreenCaptureRequest事件

deny10+

deny(): void

拒绝网页所请求的屏幕捕获操作。

getOrigin10+

getOrigin(): string

获取网页来源。

返回值:

类型说明
string当前请求权限网页的来源。

grant10+

grant(config: ScreenCaptureConfig): void

需要权限: ohos.permission.MICROPHONE,ohos.permission.CAPTURE_SCREEN

对网页访问的屏幕捕获操作进行授权。

参数:

参数名参数类型必填默认值参数描述
configScreenCaptureConfig-屏幕捕获配置。

ContextMenuSourceType9+枚举说明

名称描述
None0其他事件来源。
Mouse1鼠标事件。
LongPress2长按事件。

ContextMenuMediaType9+枚举说明

名称描述
None0非特殊媒体或其他媒体类型。
Image1图片。

ContextMenuInputFieldType9+枚举说明

名称描述
None0非输入框。
PlainText1纯文本类型,包括text、search、email等。
Password2密码类型。
Number3数字类型。
Telephone4电话号码类型。
Other5其他类型。

ContextMenuEditStateFlags9+枚举说明

名称描述
NONE0不可编辑。
CAN_CUT1支持剪切。
CAN_COPY2支持拷贝。
CAN_PASTE4支持粘贴。
CAN_SELECT_ALL8支持全选。

WebContextMenuParam9+

实现长按页面元素或鼠标右键弹出来的菜单信息。示例代码参考onContextMenuShow事件

x9+

x(): number

弹出菜单的x坐标。

返回值:

类型说明
number显示正常返回非负整数,否则返回-1。

y9+

y(): number

弹出菜单的y坐标。

返回值:

类型说明
number显示正常返回非负整数,否则返回-1。

getLinkUrl9+

getLinkUrl(): string

获取链接地址。

返回值:

类型说明
string如果长按位置是链接,返回经过安全检查的url链接。

getUnfilteredLinkUrl9+

getUnfilteredLinkUrl(): string

获取链接地址。

返回值:

类型说明
string如果长按位置是链接,返回原始的url链接。

getSourceUrl9+

getSourceUrl(): string

获取sourceUrl链接。

返回值:

类型说明
string如果选中的元素有src属性,返回src的url。

existsImageContents9+

existsImageContents(): boolean

是否存在图像内容。

返回值:

类型说明
boolean长按位置中有图片返回true,否则返回false。

getMediaType9+

getMediaType(): ContextMenuMediaType

获取网页元素媒体类型。

返回值:

类型说明
ContextMenuMediaType网页元素媒体类型。

getSelectionText9+

getSelectionText(): string

获取选中文本。

返回值:

类型说明
string菜单上下文选中文本内容,不存在则返回空。

getSourceType9+

getSourceType(): ContextMenuSourceType

获取菜单事件来源。

返回值:

类型说明
ContextMenuSourceType菜单事件来源。

getInputFieldType9+

getInputFieldType(): ContextMenuInputFieldType

获取网页元素输入框类型。

返回值:

类型说明
ContextMenuInputFieldType输入框类型。

isEditable9+

isEditable(): boolean

获取网页元素是否可编辑标识。

返回值:

类型说明
boolean网页元素可编辑返回true,不可编辑返回false。

getEditStateFlags9+

getEditStateFlags(): number

获取网页元素可编辑标识。

返回值:

类型说明
number网页元素可编辑标识,参照ContextMenuEditStateFlags

WebContextMenuResult9+

实现长按页面元素或鼠标右键弹出来的菜单所执行的响应事件。示例代码参考onContextMenuShow事件

closeContextMenu9+

closeContextMenu(): void

不执行WebContextMenuResult其他接口操作时,需要调用此接口关闭菜单。

copyImage9+

copyImage(): void

WebContextMenuParam有图片内容则复制图片。

copy9+

copy(): void

执行与此上下文菜单相关的拷贝操作。

paste9+

paste(): void

执行与此上下文菜单相关的粘贴操作。

cut9+

cut(): void

执行与此上下文菜单相关的剪切操作。

selectAll9+

selectAll(): void

执行与此上下文菜单相关的全选操作。

JsGeolocation

Web组件返回授权或拒绝权限功能的对象。示例代码参考onGeolocationShow事件

invoke

invoke(origin: string, allow: boolean, retain: boolean): void

设置网页地理位置权限状态。

参数:

参数名参数类型必填默认值参数描述
originstring-指定源的字符串索引。
allowboolean-设置的地理位置权限状态。
retainboolean-是否允许将地理位置权限状态保存到系统中。可通过GeolocationPermissions9+接口管理保存到系统的地理位置权限。

MessageLevel枚举说明

名称描述
Debug0调试级别。
Error1错误级别。
Info2消息级别。
Log3日志级别。
Warn4警告级别。

RenderExitReason9+枚举说明

onRenderExited接口返回的渲染进程退出的具体原因。

名称描述
ProcessAbnormalTermination0渲染进程异常退出。
ProcessWasKilled1收到SIGKILL,或被手动终止。
ProcessCrashed2渲染进程崩溃退出,如段错误。
ProcessOom3程序内存不足。
ProcessExitUnknown4其他原因。

MixedMode枚举说明

名称描述
All0允许加载HTTP和HTTPS混合内容。所有不安全的内容都可以被加载。
Compatible1混合内容兼容性模式,部分不安全的内容可能被加载。
None2不允许加载HTTP和HTTPS混合内容。

CacheMode9+枚举说明

名称描述
Default0使用未过期的cache加载资源,如果cache中无该资源则从网络中获取。
None1加载资源使用cache,如果cache中无该资源则从网络中获取。
Online2加载资源不使用cache,全部从网络中获取。
Only3只从cache中加载资源。

FileSelectorMode9+枚举说明

名称描述
FileOpenMode0打开上传单个文件。
FileOpenMultipleMode1打开上传多个文件。
FileOpenFolderMode2打开上传文件夹模式。
FileSaveMode3文件保存模式。

HitTestType枚举说明

名称描述
EditText0可编辑的区域。
Email1电子邮件地址。
HttpAnchor2超链接,其src为http。
HttpAnchorImg3带有超链接的图片,其中超链接的src为http。
Img4HTML::img标签。
Map5地理地址。
Phone6电话号码。
Unknown7未知内容。

OverScrollMode11+枚举说明

名称描述
NEVER0Web过滚动模式关闭。
ALWAYS1Web过滚动模式开启。

OnContextMenuHideCallback11+

上下文菜单自定义隐藏的回调。

SslError9+枚举说明

onSslErrorEventReceive接口返回的SSL错误的具体原因。

名称描述
Invalid0一般错误。
HostMismatch1主机名不匹配。
DateInvalid2证书日期无效。
Untrusted3证书颁发机构不受信任。

ProtectedResourceType9+枚举说明

名称描述备注
MidiSysexTYPE_MIDI_SYSEXMIDI SYSEX资源。目前仅支持权限事件上报,MIDI设备的使用还未支持。
VIDEO_CAPTURE10+TYPE_VIDEO_CAPTURE视频捕获资源,例如相机。
AUDIO_CAPTURE10+TYPE_AUDIO_CAPTURE音频捕获资源,例如麦克风。

WebDarkMode9+枚举说明

名称描述
Off0Web深色模式关闭。
On1Web深色模式开启。
Auto2Web深色模式跟随系统。

WebCaptureMode10+枚举说明

名称描述
HOME_SCREEN0主屏捕获模式。

WebMediaOptions10+

Web媒体策略的配置。

名称类型可读可写必填说明
resumeIntervalnumber被暂停的Web音频能够自动续播的有效期,单位:秒。最长有效期为60秒,由于近似值原因,该有效期可能存在一秒内的误差。
audioExclusiveboolean应用内多个Web实例的音频是否独占。

ScreenCaptureConfig10+

Web屏幕捕获的配置。

名称类型可读可写必填说明
captureModeWebCaptureModeWeb屏幕捕获模式。

WebLayoutMode11+枚举说明

名称描述
NONE0Web布局跟随系统。
FIT_CONTENT1Web基于页面大小的自适应网页布局。

NestedScrollOptions11+对象说明

名称类型描述
scrollForwardNestedScrollMode可滚动组件往末尾端滚动时的嵌套滚动选项。
scrollBackwardNestedScrollMode可滚动组件往起始端滚动时的嵌套滚动选项。

NestedScrollMode11+枚举说明

名称描述
SELF_ONLY0只自身滚动,不与父组件联动。
SELF_FIRST1自身先滚动,自身滚动到边缘以后父组件滚动。父组件滚动到边缘以后,如果父组件有边缘效果,则父组件触发边缘效果,否则子组件触发边缘效果。
PARENT_FIRST2父组件先滚动,父组件滚动到边缘以后自身滚动。自身滚动到边缘后,如果有边缘效果,会触发自身的边缘效果,否则触发父组件的边缘效果。
PARALLEL3自身和父组件同时滚动,自身和父组件都到达边缘以后,如果自身有边缘效果,则自身触发边缘效果,否则父组件触发边缘效果。

DataResubmissionHandler9+

通过DataResubmissionHandler可以重新提交表单数据或取消提交表单数据。

resend9+

resend(): void

重新发送表单数据。

示例:

// 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 })
       .onDataResubmitted((event) => {
        console.log('onDataResubmitted')
        event.handler.resend();
      })
    }
  }
}

cancel9+

cancel(): void

取消重新发送表单数据。

示例:

// 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 })
       .onDataResubmitted((event) => {
        console.log('onDataResubmitted')
        event.handler.cancel();
      })
    }
  }
}

WebController

通过WebController可以控制Web组件各种行为。一个WebController对象只能控制一个Web组件,且必须在Web组件和WebController绑定后,才能调用WebController上的方法。

从API version 9开始不再维护,建议使用WebviewController9+代替。

创建对象

let webController: WebController = new WebController()

getCookieManager(deprecated)

getCookieManager(): WebCookie

获取web组件cookie管理对象。

从API version 9开始不再维护,建议使用getCookie代替。

返回值:

类型说明
WebCookieweb组件cookie管理对象,参考WebCookie定义。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('getCookieManager')
        .onClick(() => {
          let cookieManager = this.controller.getCookieManager()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

requestFocus(deprecated)

requestFocus()

使当前web页面获取焦点。

从API version 9开始不再维护,建议使用requestFocus9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('requestFocus')
        .onClick(() => {
          this.controller.requestFocus()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

accessBackward(deprecated)

accessBackward(): boolean

当前页面是否可后退,即当前页面是否有返回历史记录。

从API version 9开始不再维护,建议使用accessBackward9+代替。

返回值:

类型说明
boolean可以后退返回true,否则返回false。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('accessBackward')
        .onClick(() => {
          let result = this.controller.accessBackward()
          console.log('result:' + result)
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

accessForward(deprecated)

accessForward(): boolean

当前页面是否可前进,即当前页面是否有前进历史记录。

从API version 9开始不再维护,建议使用accessForward9+代替。

返回值:

类型说明
boolean可以前进返回true,否则返回false。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('accessForward')
        .onClick(() => {
          let result = this.controller.accessForward()
          console.log('result:' + result)
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

accessStep(deprecated)

accessStep(step: number): boolean

当前页面是否可前进或者后退给定的step步。

从API version 9开始不再维护,建议使用accessStep9+代替。

参数:

参数名参数类型必填默认值参数描述
stepnumber-要跳转的步数,正数代表前进,负数代表后退。

返回值:

类型说明
boolean页面是否前进或后退

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()
  @State steps: number = 2

  build() {
    Column() {
      Button('accessStep')
        .onClick(() => {
          let result = this.controller.accessStep(this.steps)
          console.log('result:' + result)
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

backward(deprecated)

backward(): void

按照历史栈,后退一个页面。一般结合accessBackward一起使用。

从API version 9开始不再维护,建议使用backward9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('backward')
        .onClick(() => {
          this.controller.backward()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

forward(deprecated)

forward(): void

按照历史栈,前进一个页面。一般结合accessForward一起使用。

从API version 9开始不再维护,建议使用forward9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('forward')
        .onClick(() => {
          this.controller.forward()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

deleteJavaScriptRegister(deprecated)

deleteJavaScriptRegister(name: string)

删除通过registerJavaScriptProxy注册到window上的指定name的应用侧JavaScript对象。删除后立即生效,无须调用refresh接口。

从API version 9开始不再维护,建议使用deleteJavaScriptRegister9+代替。

参数:

参数名参数类型必填默认值参数描述
namestring-注册对象的名称,可在网页侧JavaScript中通过此名称调用应用侧JavaScript对象。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()
  @State name: string = 'Object'

  build() {
    Column() {
      Button('deleteJavaScriptRegister')
        .onClick(() => {
          this.controller.deleteJavaScriptRegister(this.name)
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

getHitTest(deprecated)

getHitTest(): HitTestType

获取当前被点击区域的元素类型。

从API version 9开始不再维护,建议使用getHitTest9+代替。

返回值:

类型说明
HitTestType被点击区域的元素类型。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('getHitTest')
        .onClick(() => {
          let hitType = this.controller.getHitTest()
          console.log("hitType: " + hitType)
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

loadData(deprecated)

loadData(options: { data: string, mimeType: string, encoding: string, baseUrl?: string, historyUrl?: string })

baseUrl为空时,通过”data“协议加载指定的一段字符串。

当baseUrl为”data“协议时,编码后的data字符串将被Web组件作为”data"协议加载。

当baseUrl为“http/https"协议时,编码后的data字符串将被Web组件以类似loadUrl的方式以非编码字符串处理。

从API version 9开始不再维护,建议使用loadData9+代替。

参数:

参数名参数类型必填默认值参数描述
datastring-按照”Base64“或者”URL"编码后的一段字符串。
mimeTypestring-媒体类型(MIME)。
encodingstring-编码类型,具体为“Base64"或者”URL编码。
baseUrlstring-指定的一个URL路径(“http”/“https”/"data"协议),并由Web组件赋值给window.origin。
historyUrlstring-历史记录URL。非空时,可被历史记录管理,实现前后后退功能。当baseUrl为空时,此属性无效。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('loadData')
        .onClick(() => {
          this.controller.loadData({
            data: "<html><body bgcolor=\"white\">Source:<pre>source</pre></body></html>",
            mimeType: "text/html",
            encoding: "UTF-8"
          })
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

loadUrl(deprecated)

loadUrl(options: { url: string | Resource, headers?: Array<Header> })

使用指定的http头加载指定的URL。

通过loadUrl注入的对象只在当前document有效,即通过loadUrl导航到新的页面会无效。

而通过registerJavaScriptProxy注入的对象,在loadUrl导航到新的页面也会有效。

从API version 9开始不再维护,建议使用loadUrl9+代替。

参数:

参数名参数类型必填默认值参数描述
urlstring | Resource-需要加载的 URL。
headersArray<Header>[]URL的附加HTTP请求头。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('loadUrl')
        .onClick(() => {
          this.controller.loadUrl({ url: 'www.example.com' })
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

onActive(deprecated)

onActive(): void

调用此接口通知Web组件进入前台激活状态。

从API version 9开始不再维护,建议使用onActive9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('onActive')
        .onClick(() => {
          this.controller.onActive()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

onInactive(deprecated)

onInactive(): void

调用此接口通知Web组件进入未激活状态。

从API version 9开始不再维护,建议使用onInactive9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('onInactive')
        .onClick(() => {
          this.controller.onInactive()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

zoom(deprecated)

zoom(factor: number): void

调整当前网页的缩放比例。

从API version 9开始不再维护,建议使用zoom9+代替。

参数:

参数名参数类型必填参数描述
factornumber基于当前网页所需调整的相对缩放比例,正值为放大,负值为缩小。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()
  @State factor: number = 1

  build() {
    Column() {
      Button('zoom')
        .onClick(() => {
          this.controller.zoom(this.factor)
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

refresh(deprecated)

refresh()

调用此接口通知Web组件刷新网页。

从API version 9开始不再维护,建议使用refresh9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('refresh')
        .onClick(() => {
          this.controller.refresh()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

registerJavaScriptProxy(deprecated)

registerJavaScriptProxy(options: { object: object, name: string, methodList: Array<string> })

注入JavaScript对象到window对象中,并在window对象中调用该对象的方法。注册后,须调用refresh接口生效。

从API version 9开始不再维护,建议使用registerJavaScriptProxy9+代替。

参数:

参数名参数类型必填默认值参数描述
objectobject-参与注册的应用侧JavaScript对象。只能声明方法,不能声明属性 。其中方法的参数和返回类型只能为string,number,boolean
namestring-注册对象的名称,与window中调用的对象名一致。注册后window对象可以通过此名字访问应用侧JavaScript对象。
methodListArray<string>-参与注册的应用侧JavaScript对象的方法。

示例:

// xxx.ets
class TestObj {
  constructor() {
  }

  test(): string {
    return "ArkUI Web Component"
  }

  toString(): void {
    console.log('Web Component toString')
  }
}

@Entry
@Component
struct Index {
  controller: WebController = new WebController()
  testObj = new TestObj();
  build() {
    Column() {
      Row() {
        Button('Register JavaScript To Window').onClick(() => {
          this.controller.registerJavaScriptProxy({
            object: this.testObj,
            name: "objName",
            methodList: ["test", "toString"],
          })
        })
      }
      Web({ src: $rawfile('index.html'), controller: this.controller })
        .javaScriptAccess(true)
    }
  }
}

加载的html文件。

<!-- index.html -->
<!DOCTYPE html>
<html>
    <meta charset="utf-8">
    <body>
        Hello world!
    </body>
    <script type="text/javascript">
    function htmlTest() {
        str = objName.test("test function")
        console.log('objName.test result:'+ str)
    }
</script>
</html>

runJavaScript(deprecated)

runJavaScript(options: { script: string, callback?: (result: string) => void })

异步执行JavaScript脚本,并通过回调方式返回脚本执行的结果。runJavaScript需要在loadUrl完成后,比如onPageEnd中调用。

从API version 9开始不再维护,建议使用runJavaScript9+代替。

参数:

参数名参数类型必填默认值参数描述
scriptstring-JavaScript脚本。
callback(result: string) => void-回调执行JavaScript脚本结果。JavaScript脚本若执行失败或无返回值时,返回null。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()
  @State webResult: string = ''
  build() {
    Column() {
      Text(this.webResult).fontSize(20)
      Web({ src: $rawfile('index.html'), controller: this.controller })
      .javaScriptAccess(true)
      .onPageEnd((event) => {
        this.controller.runJavaScript({
          script: 'test()',
          callback: (result: string)=> {
            this.webResult = result
            console.info(`The test() return value is: ${result}`)
          }})
        if (event) {
          console.info('url: ', event.url)
        }
      })
    }
  }
}

加载的html文件。

<!-- index.html -->
<!DOCTYPE html>
<html>
  <meta charset="utf-8">
  <body>
      Hello world!
  </body>
  <script type="text/javascript">
  function test() {
      console.log('Ark WebComponent')
      return "This value is from index.html"
  }
  </script>
</html>

stop(deprecated)

stop()

停止页面加载。

从API version 9开始不再维护,建议使用stop9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('stop')
        .onClick(() => {
          this.controller.stop()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

clearHistory(deprecated)

clearHistory(): void

删除所有前进后退记录。

从API version 9开始不再维护,建议使用clearHistory9+代替。

示例:

// xxx.ets
@Entry
@Component
struct WebComponent {
  controller: WebController = new WebController()

  build() {
    Column() {
      Button('clearHistory')
        .onClick(() => {
          this.controller.clearHistory()
        })
      Web({ src: 'www.example.com', controller: this.controller })
    }
  }
}

WebCookie(deprecated)

通过WebCookie可以控制Web组件中的cookie的各种行为,其中每个应用中的所有web组件共享一个WebCookie。通过controller方法中的getCookieManager方法可以获取WebCookie对象,进行后续的cookie管理操作。

setCookie(deprecated)

setCookie()

设置cookie,该方法为同步方法。设置成功返回true,否则返回false。

从API version 9开始不再维护,建议使用setCookie9+代替。

saveCookie(deprecated)

saveCookie()

将当前存在内存中的cookie同步到磁盘中,该方法为同步方法。

从API version 9开始不再维护,建议使用saveCookieAsync9+代替。

ScriptItem11+

通过javaScriptOnDocumentStart属性注入到Web组件的ScriptItem对象。

名称类型必填描述
scriptstring需要注入、执行的JavaScript脚本。
scriptRulesArray<string>一组允许来源的匹配规则。

NavigationType11+

定义navigation类型。

名称描述
UNKNOWN0未知类型。
MAIN_FRAME_NEW_ENTRY1主文档上产生的新的历史节点跳转。
MAIN_FRAME_EXISTING_ENTRY2主文档上产生的到已有的历史节点的跳转。
NAVIGATION_TYPE_NEW_SUBFRAME4子文档上产生的用户触发的跳转。
NAVIGATION_TYPE_AUTO_SUBFRAME5子文档上产生的非用户触发的跳转。

LoadCommittedDetails11+

提供已提交跳转的网页的详细信息。

名称类型必填描述
isMainFrameboolean是否是主文档。
isSameDocumentboolean是否在不更改文档的情况下进行的网页跳转。在同文档跳转的示例:1.参考片段跳转;2.pushState或replaceState触发的跳转;3.同一页面历史跳转。
didReplaceEntryboolean是否提交的新节点替换了已有的节点。另外在一些子文档跳转的场景,虽然没有实际替换已有节点,但是有一些属性发生了变更。
navigationTypeNavigationType网页跳转的类型。
urlstring当前跳转网页的URL。

ThreatType11+

定义网站风险类型。

名称描述
THREAT_ILLEGAL非法网站。
THREAT_FRAUD欺诈网站。
THREAT_RISK存在安全风险的网站。
THREAT_WARNING涉嫌包含不健康内容的网站。

OnNavigationEntryCommittedCallback11+

type OnNavigationEntryCommittedCallback = (loadCommittedDetails: LoadCommittedDetails) => void

导航条目提交时触发的回调。

参数名参数类型参数描述
loadCommittedDetailsLoadCommittedDetails提供已提交跳转的网页的详细信息。

OnSafeBrowsingCheckResultCallback11+

type OnSafeBrowsingCheckResultCallback = (threatType: ThreatType) => void

网站安全风险检查触发的回调。

参数名参数类型参数描述
threatTypeThreatType定义网站threat类型。

NativeEmbedStatus11+

定义Embed标签生命周期。

名称描述
CREATE0Embed标签创建。
UPDATE1Embed标签更新。
DESTROY2Embed标签销毁。

NativeEmbedInfo11+

提供Embed标签的详细信息。

名称类型必填描述
idnumberEmbed标签的id信息。
typestringEmbed标签的type信息。
srcstringEmbed标签的src信息。
widthnumberEmbed标签的宽。
heightnumberEmbed标签的高。
urlstringEmbed标签的url信息。

NativeEmbedDataInfo11+

提供Embed标签生命周期变化的详细信息。

名称类型必填描述
statusNativeEmbedStatusEmbed标签生命周期状态。
surfaceIdstringNativeImage的psurfaceid。
embedIdstringEmbed标签的唯一id。
infoNativeEmbedInfoEmbed标签的详细信息。

NativeEmbedTouchInfo11+

提供手指触摸到Embed标签的详细信息。

名称类型必填描述
embedIdstringEmbed标签的唯一id。
touchEventTouchEvent手指触摸动作信息。

最后,有很多小伙伴不知道学习哪些鸿蒙开发技术?不知道需要重点掌握哪些鸿蒙应用开发知识点?而且学习时频繁踩坑,最终浪费大量时间。所以有一份实用的鸿蒙(Harmony NEXT)资料用来跟着学习是非常有必要的。 

这份鸿蒙(Harmony NEXT)资料包含了鸿蒙开发必掌握的核心知识要点,内容包含了ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等)鸿蒙(Harmony NEXT)技术知识点。

希望这一份鸿蒙学习资料能够给大家带来帮助,有需要的小伙伴自行领取,限时开源,先到先得~无套路领取!!

获取这份完整版高清学习路线,请点击→纯血版全套鸿蒙HarmonyOS学习资料

鸿蒙(Harmony NEXT)最新学习路线

  •  HarmonOS基础技能

  • HarmonOS就业必备技能 
  •  HarmonOS多媒体技术

  • 鸿蒙NaPi组件进阶

  • HarmonOS高级技能

  • 初识HarmonOS内核 
  • 实战就业级设备开发

有了路线图,怎么能没有学习资料呢,小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的鸿蒙(OpenHarmony )学习手册(共计1236页)鸿蒙(OpenHarmony )开发入门教学视频,内容包含:ArkTS、ArkUI、Web开发、应用模型、资源分类…等知识点。

获取以上完整版高清学习路线,请点击→纯血版全套鸿蒙HarmonyOS学习资料

《鸿蒙 (OpenHarmony)开发入门教学视频》

《鸿蒙生态应用开发V2.0白皮书》

图片

《鸿蒙 (OpenHarmony)开发基础到实战手册》

OpenHarmony北向、南向开发环境搭建

图片

 《鸿蒙开发基础》

  • ArkTS语言
  • 安装DevEco Studio
  • 运用你的第一个ArkTS应用
  • ArkUI声明式UI开发
  • .……

图片

 《鸿蒙开发进阶》

  • Stage模型入门
  • 网络管理
  • 数据管理
  • 电话服务
  • 分布式应用开发
  • 通知与窗口管理
  • 多媒体技术
  • 安全技能
  • 任务管理
  • WebGL
  • 国际化开发
  • 应用测试
  • DFX面向未来设计
  • 鸿蒙系统移植和裁剪定制
  • ……

图片

《鸿蒙进阶实战》

  • ArkTS实践
  • UIAbility应用
  • 网络案例
  • ……

图片

 获取以上完整鸿蒙HarmonyOS学习资料,请点击→纯血版全套鸿蒙HarmonyOS学习资料

总结

总的来说,华为鸿蒙不再兼容安卓,对中年程序员来说是一个挑战,也是一个机会。只有积极应对变化,不断学习和提升自己,他们才能在这个变革的时代中立于不败之地。 

  • 24
    点赞
  • 30
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值