鸿蒙HarmonyOS与 H5 的通信主要通过 ‌Web 组件WebView‌ 实现支持多种机制以满足不同场景需求。‌一、通信方法‌‌1.runJavaScript()方法原生 → H5‌鸿蒙原生侧通过WebviewController.runJavaScript()执行 H5 页面中的 JavaScript 代码可调用全局函数、获取或修改页面数据。‌特点‌简单直接适用于单向调用或轻量交互‌示例‌this.webviewController.runJavaScript(window.updateUI(data));‌2.registerJavaScriptProxy()/addJavaScriptObject()H5 → 原生‌在鸿蒙侧将 ArkTS 方法或对象暴露给 H5H5 通过全局对象如JSBridge直接调用原生能力。‌特点‌支持双向异步通信需注意命名冲突与安全风险‌示例‌State jsBridge new JsBridge(); Web({ src: $rawfile(index.html), controller: this.controller }) .javaScriptProxy({ object: this.jsBridge, name: JSBridge, methodList: [nativeMethod] });‌3.postMessage()WebMessagePort双向异步通信‌基于 HTML5 的postMessage机制通过createWebMessagePorts()创建一对消息端口实现高效、安全的双向事件驱动通信。‌特点‌适合高频、大数据量或复杂交互场景推荐用于生产环境‌流程‌鸿蒙侧创建端口对[port1, port2]将port2发送给 H5postMessage(initPort, [port2])H5 缓存端口并监听消息双方可通过port.postMessage()主动通信‌4. 第三方桥接库如 DSBridge‌‌二、通信原理‌方式通信方向机制适用场景runJavaScript原生 → H5执行 JS 脚本简单指令、数据注入JSBridge注入H5 → 原生暴露原生方法为全局对象H5 调用原生功能如相机、定位postMessageMessagePort双向事件通道异步通信高频、复杂、实时交互DSBridge双向封装原生-JS 桥接跨平台项目、快速集成‌三、注意事项‌‌异步为主‌绝大多数通信为异步操作H5 不能同步等待原生返回结果‌数据序列化‌传递的数据需为 JSON 兼容类型字符串、数字、对象等‌不能传递函数或 DOM 对象‌‌安全防护‌仅注入必要原生接口验证postMessage消息来源检查event.origin或event.source避免动态拼接 JS 字符串以防注入攻击‌生命周期管理‌确保在 H5 页面加载完成后才发起通信避免调用未定义的函数或对象