需要先初始化webview.WebMessagePort，然后一个ets使用，发送一个端口给html去用。
来个视频展示一下效果（文件有点大，1.8M，估计要载入一会儿）：
6月25日

这里的流程蛮有意思的，画个图解释一下。
鸿蒙html通信

ets端
// …
const HARMONY_PORT = 0;
const HTML_PORT = 1;
// …
export default struct AppWebViewPage {
// …
build() {
Web({
src: this.url,
controller: this.webviewController,
})
.onPageEnd(() => {
try {
this.ports = this.webviewController.createWebMessagePorts() || [];
// 这里会返回2个端口。
// 有点类似于 实例化了一个网页和鸿蒙之间发送消息的管道，然后把管道的两个头作为端口返回回来
// 所以这里就有有2个端口，也就是这个通信管道的2个头
// 那么
// 1. 使用 HARMONY_PORT 端口，作为鸿蒙的端口，用来发送和接收消息
// 2. 使用 HTML_PORT 端口，作为html的端口，把这个端口通过 HARMONY_PORT 端口发给html，让html来使用。
if (!this.ports || this.ports.length < 2) {
hilog.error(1, ‘Error’, ‘创建端口失败：返回端口数量不足’);
return;
}
/* 端口0, 给鸿蒙端使用 /
this.ports[HARMONY_PORT].onMessageEvent((result: webview.WebMessage) => {
this.onMessageEvent(result);
});
/ 端口1, 发送给html进行使用 /
this.webviewController.postMessage(‘init__project’, [this.ports[HTML_PORT]], '');
} catch (e) {
hilog.error(1, ‘Error’, ‘初始化 WebMessagePort 失败：’ + JSON.stringify(e));
}
})
}

/**

• 接收到H5消息
• @param result
  */
  private onMessageEvent(result: webview.WebMessage) {
  let msg = ‘’;
  try {
  msg = result.toString() || ‘’;
  hilog.info(1, ‘INFO’, ‘onMessageEvent：’ + msg);
  } catch (e) {
  hilog.error(1, ‘Error’, ‘获取消息字符串失败：’ + JSON.stringify(e));
  return;
  }
  }

/**

• 向H5发布消息
• @param message
  */
  public sendMessageToH5(message: string) {
  hilog.info(1, ‘INFO’, ‘sendMessageToH5：’ + message);
  try {
  this.ports[HARMONY_PORT].postMessageEvent(message);
  } catch (error) {
  hilog.error(1, ‘Error’, ‘向H5发布消息失败：’ + JSON.stringify(error));
  }
  }
  }
  html 端

H5 Page

日志记录