HarmonyOS 鸿蒙Next怎么获取网页相关信息

发布于 1周前 作者 zlyuanteng 来自 鸿蒙OS

HarmonyOS 鸿蒙Next怎么获取网页相关信息 想实现一个功能,当发送一个链接时,能自动生成一个卡片消息,里面需要包含网页的标题、图标、描述等信息,怎么拿到网页的标题、图标、描述等信息?

2 回复

web组件加载网页,通过javaScriptOnDocumentStart将JavaScript脚本注入到Web组件中,再在onPageEnd回调中执行JavaScript脚本获取需要的标签信息,如以下demo中获取meta标签的content信息:

import webview from '@ohos.web.webview';
import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct WebShareDemo {
  webviewController: webview.WebviewController = new webview.WebviewController();

  private localStorage: string = 'function test(){\n' +
    '          console.log("Ark WebComponent----------------");\n' +
    '          var meta = document.getElementsByTagName("meta");\n' +
    '          var str = "";\n' +
    '          for ( i in meta) {\n' +
    '          if(meta[i].name != undefined) {\n' +
    '          str = str + meta[i].content;\n' +
    '          }\n' +
    '          }\n' +
    '          return str;\n' +
    '          }';
  @State scripts: Array = [
    { script: this.localStorage, scriptRules: ["*"] }
  ];

  aboutToAppear() {
    // 配置Web开启调试模式
    webview.WebviewController.setWebDebuggingAccess(true);
  }

  build() {
    Column() {
      Web({ src: 'www.baidu.com', controller: this.webviewController })
        .width(1)
        .height(1)
        .javaScriptOnDocumentStart(this.scripts)
        .onPageEnd(() => {
          console.log('>>>>>>>>>>>onPageEnd')
          this.webviewController.runJavaScript(
            test(),
            (error, result) => {
              if (error) {
                console.error(run JavaScript error, ErrorCode: ${(error as BusinessError).code}, Message: ${(error as BusinessError).message});
                return;
              }
              if (result) {
                console.info(The test() return value is: ${result});
              }
            });
        })
    }
  }
}

可以参考文档:
https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V13/ts-basic-components-web-V13#javascriptondocumentstart11
https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/web-in-app-frontend-page-function-invoking-V5

更多关于HarmonyOS 鸿蒙Next怎么获取网页相关信息的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS(鸿蒙)Next上获取网页相关信息,可以通过以下几种方式实现,这些方式主要依赖于鸿蒙系统提供的API和框架:

  1. 使用WebView组件: WebView是鸿蒙系统中用于显示网页内容的组件。通过WebView,你可以加载指定的网页URL,并监听网页加载完成后的内容。利用JavaScript接口,你还可以与网页内容进行交互,从而获取所需的信息。

  2. 网络请求: 如果网页信息可以通过API接口获取,你可以使用鸿蒙提供的网络请求API(如HttpURLConnection或OkHttp等第三方库,但需在鸿蒙环境下适配)来发送请求,并解析返回的JSON或其他格式的数据。

  3. 使用ArkUI框架: ArkUI是鸿蒙系统的UI开发框架,支持使用eTS(Enhanced TypeScript)或Java进行开发。你可以通过ArkUI构建用户界面,并结合上述两种方式(WebView或网络请求)来获取并展示网页信息。

请注意,具体实现方式可能因鸿蒙系统版本、设备类型以及你的开发需求而有所不同。在开发过程中,建议参考鸿蒙系统的官方文档和API指南,以确保代码的正确性和兼容性。

如果问题依旧没法解决请联系官网客服,官网地址是:官网地址

回到顶部