鸿蒙原生应用元服务开发-Web在新窗口中打开页面 - HarmonyOS技术社区 - 电子技术论坛

2024-05-13 16:29:02

鸿蒙 HarmonyOS

Web组件提供了在新窗口打开页面的能力，开发者可以通过multiWindowAccess()接口来设置是否允许网页在新窗口打开。当有新窗口打开时，应用侧会在onWindowNew()接口中收到Web组件新窗口事件，开发者需要在此接口事件中，新建窗口来处理Web组件窗口请求。如果开发者在onWindowNew()接口通知中不需要打开新窗口，需要将ControllerHandler.setWebController()接口返回值设置成null。

如下面的本地示例，当用户点击“新窗口中打开网页”按钮时，应用侧会在onWindowNew()接口中收到Web组件新窗口事件。

应用侧代码。

// xxx.ets

import web_webview from '@ohos.web.webview'

 

//在同一page页有两个web组件。在WebComponent新开窗口时，会跳转到NewWebViewComp。

@CustomDialog

struct NewWebViewComp {

controller?: CustomDialogController

webviewController1: web_webview.WebviewController = new web_webview.WebviewController()

build() {

    Column() {

      Web({ src: "", controller: this.webviewController1 })

        .javaScriptAccess(true)

        .multiWindowAccess(false)

        .onWindowExit(()=> {

          console.info("NewWebViewComp onWindowExit")

          if (this.controller) {

            this.controller.close()

          }

        })

      }

  }

}

 

@Entry

@Component

struct WebComponent {

    controller: web_webview.WebviewController = new web_webview.WebviewController()

    dialogController: CustomDialogController | null = null

    build() {

      Column() {

        Web({ src:$rawfile("window.html"), controller: this.controller })

          .javaScriptAccess(true)

         //需要使能multiWindowAccess

          .multiWindowAccess(true)

          .onWindowNew((event) => {

          if (this.dialogController) {

            this.dialogController.close()

          }

          let popController:web_webview.WebviewController = new web_webview.WebviewController()

          this.dialogController = new CustomDialogController({

            builder: NewWebViewComp({webviewController1: popController})

          })

          this.dialogController.open()

          //将新窗口对应WebviewController返回给Web内核。

          //如果不需要打开新窗口请调用event.handler.setWebController接口设置成null。

          //若不调用event.handler.setWebController接口，会造成render进程阻塞。

          event.handler.setWebController(popController)

        })

    }

  }

}

window.html页面代码。

 <!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>WindowEvent</title>

</head>

<body>

<input type="button" value="新窗口中打开网页" onclick="OpenNewWindow()">

<script type="text/javascript">

    function OpenNewWindow()

    {

        let openedWindow = window.open("about:blank", "", "location=no,status=no,scrollvars=no");

        openedWindow.document.write("<p>这是我的窗口</p>");

        openedWindow.focus();

    }

</script>

</body>

</html>

本文参考引用HarmonyOS官方开发文档，基于API9。

回帖高级模式

声明：本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人，不代表电子发烧友网立场。文章及其配图仅供工程师学习之用，如有内容图片侵权或者其他问题，请联系本站作侵删。侵权投诉

[文章]鸿蒙原生应用元服务开发-Web在新窗口中打开页面

回帖高级模式