微信小程序webview与h5通过postMessage实现实时通讯后进行回调

微信小程序中的 `wx webView` 组件允许嵌入网页内容，当它与外部H5页面进行通信时，可以利用浏览器提供的 `postMessage` API 实现数据传输，包括实时的消息传递。H5可以通过监听 `message` 事件来接收来自微信小程序的消息，并进行相应的处理。

在两者的交互过程中，通常有以下几个步骤：

1. **在H5端**：首先需要设置 `window.postMessage` 的监听器，当微信小程序发送消息过来时，会触发这个函数。例如：

   window.addEventListener('message', function(e) {
     if (e.origin === 'your-miniprogram-domain') { // 检查消息来源
       console.log('Received message:', e.data);
       // 这里可以执行你的业务逻辑，然后进行回调
       handleCallback(e.data);
     }
   });

2. **在微信小程序端**：通过 `wx.invoke` 或者 `wx.request` 等API调用到H5页面，并使用 `postMessage` 发送数据：

   wx.postMessage({
     data: '你需要在H5端处理的数据',
     targetOrigin: 'http://your-h5-url.com', // H5页面的URL
   }, '*', 'your-miniprogram-domain');

3. **回调机制**：由于JavaScript本身没有原生的异步回调功能，H5端接收到消息后如果需要微信小程序执行某个回调，一般会将一个函数名或者其他标识作为消息的一部分返回，小程序可以在接收到这个标识后主动再次调用H5的某个特定方法，完成整个过程。