在 H5 页面和 uniapp 小程序之间进行数据通信

在H5页面和uniapp小程序之间进行数据通信，可以使用自定义的事件系统或者使用uniapp提供的uni.postMessage和uni.onMessage API。

以下是一个简单的示例，展示了如何在H5页面和uniapp小程序之间发送和接收数据：

H5页面（假设使用Vue框架）:

// H5页面发送数据到小程序
function sendDataToMiniProgram(data) {
  // 检查小程序是否在窗口中打开
  if (window.uni) {
    window.uni.postMessage({
      data
    });
  }
}
 
// 监听来自小程序的消息
window.addEventListener('message', function(event) {
  console.log('Received message from mini program:', event.data);
}, false);

uniapp小程序:

// 小程序页面 onLoad 中
onLoad() {
  // 监听H5页面发送的消息
  uni.onMessage((message) => {
    console.log('Received message from H5:', message.data);
  });
}
 
// 小程序页面发送数据到H5
function sendDataToH5(data) {
  // 注意：只有在通过uni.navigateTo或者uni.redirectTo打开的H5页面，才能使用下面的方法
  uni.postMessage({
    data
  });
}
 
// 监听来自H5页面的消息
window.addEventListener('message', function(event) {
  console.log('Received message from H5:', event.data);
}, false);

确保在小程序中通过uni.navigateTo或uni.redirectTo打开H5页面，并且该页面已经加载完成。如果是在WebView中打开H5页面，则需要使用uni.createWebViewContext来创建通讯接口。