HarmonyOS鸿蒙Next中应用测向前端Html发送大数据（如图片的base64），解决runJavaScript无法发送大数据的问题！

HarmonyOS鸿蒙Next中应用测向前端Html发送大数据（如图片的base64），解决runJavaScript无法发送大数据的问题！

应用测:

```kotlin
try {
  // 创建端口
  this.ports = this.controller.createWebMessagePorts()
  // 将消息端口(如端口0)发送到HTML侧，由HTML侧保存并使用。
  this.controller.postMessage('__init_port__', [this.ports[0]], '*')
  // 在应用侧的消息端口(如端口1)上注册回调事件, 该回调事件 注:必须注册 必须注册 必须注册  不然连信息无法发送到前端，
  this.ports[1].onMessageEvent((result: web_webview.WebMessage) => {
  })
  if (this.ports && this.ports[1]) {
    this.ports[1].postMessageEvent(infos)
  }
} catch (e) {
  console.error(e)
}

Html：

window.addEventListener('message', function (event) {
    if (event.data === '__init_port__') {
        if (event.ports[0] !== null) {
            // 保存从应用侧发送过来的端口
            const h5Port = event.ports[0];
            h5Port.onmessage = function (event) {
              // 获取数据
                let result = event.data;
                if (typeof (result) === 'string') {
                    demoimg.src = result
                }

            }
        }
    }
})

更多关于HarmonyOS鸿蒙Next中应用测向前端Html发送大数据（如图片的base64），解决runJavaScript无法发送大数据的问题！的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

好用，谢谢

更多关于HarmonyOS鸿蒙Next中应用测向前端Html发送大数据（如图片的base64），解决runJavaScript无法发送大数据的问题！的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


终于有人说明白这个问题了，感谢博主

在HarmonyOS鸿蒙Next中，应用向前端HTML发送大数据（如图片的base64数据）时，runJavaScript方法由于性能限制可能无法处理大数据传输。可以通过以下步骤解决：

  1. 使用WebMessagePort进行通信：WebMessagePort是鸿蒙提供的一种高效的双向通信机制，适合处理大数据传输。首先在前端HTML中创建MessageChannel，并将一个端口传递给应用端。

  2. 应用端接收端口并发送数据：在应用端通过WebView的addJavascriptInterface方法接收前端传递的端口，然后通过该端口发送大数据。

  3. 前端接收数据：前端通过MessageChannel的另一个端口接收应用端发送的数据。

代码示例：

前端HTML：

<script>
    const channel = new MessageChannel();
    window.hwjsBridge = channel.port1;
    channel.port1.onmessage = (event) => {
        console.log('Received data:', event.data);
    };
    window.hwjsBridge.postMessage('ready');
</script>

应用端：

import webview from '@ohos.web.webview';

let webView = webview.WebView.create(context);
webView.addJavascriptInterface({
    onMessage: (port) => {
        port.postMessage(largeData);
    }
}, 'hwjsBridge');

在HarmonyOS鸿蒙Next中，若需通过runJavaScript向前端HTML发送大数据（如图片的base64），由于runJavaScript对数据大小有限制，建议采用以下方案：

  1. 分块传输：将大数据拆分为多个小块，通过多次调用runJavaScript发送。
  2. WebSocket通信：建立WebSocket连接，通过WebSocket传输大数据，前端接收后处理。
  3. 本地存储：将数据存储到本地文件或数据库，前端通过接口读取。

推荐使用WebSocket，因其支持高效的大数据传输，且实时性较好。

回到顶部