WebView 数据监测¶

本文用于承载 HarmonyOS WebView 场景下的数据采集方式。

开启方式¶

在 RUM 配置中开启 setEnableTraceWebView(true) 后，SDK 会自动采集 WebView 中的 RUM 数据。

配置 Host 白名单¶

可使用 setAllowWebViewHost(...) 限制允许使用 WebView JavaScript Bridge 的 Host。白名单会提供给 WebView 中的 Browser SDK；传入 null 或空数组表示不限制 Host。

import { FTSDK, FTRUMConfig } from '@guancecloud/ft_sdk/Index';

const rumConfig = new FTRUMConfig()
  .setRumAppId('your-rum-app-id')
  .setEnableTraceWebView(true)
  .setAllowWebViewHost(['example.com', 'm.example.com']);

FTSDK.installRUMConfig(rumConfig);

使用示例¶

import { FTWebViewHandler } from '@guancecloud/ft_sdk/Index';
import { webview } from '@kit.ArkWeb';

@Component
export struct MyWebViewPage {
  @State webController: webview.WebviewController = new webview.WebviewController();
  private webViewHandler: FTWebViewHandler = new FTWebViewHandler();

  aboutToAppear() {
    this.webViewHandler.setWebView(this.webController);
  }

  aboutToDisappear() {
    this.webViewHandler.clearWebController();
  }

  build() {
    Web({
      src: 'https://example.com',
      controller: this.webController
    })
    .javaScriptAccess(true)
    .javaScriptProxy(this.webViewHandler.getJavaScriptProxy(this.webController))
  }
}

说明¶

FTWebViewHandler 会读取应用入口处的 RUM 配置
页面进入时绑定 webController，页面离开时及时清理
若未开启 setEnableTraceWebView(true)，则不会自动采集 WebView 数据
设置了 Host 白名单时，仅白名单中的页面可使用 JavaScript Bridge