uni-app 中 web-view 组件嵌入 h5 页面，h5 如何向 web-view 发送消息

背景

移动端项目是 vue 框架写的 h5 页面，然后 uni-app 的项目中使用 web-view 组件通过 src 指向 h5 页面，现在需要从 h5 页面发送消息，由 web-view 组件接收消息。

一、使用 postMessage

1.在 H5 页面中发送消息

window.parent.postMessage({
   
  data: {
   
    message: 'Hello from H5'
  }
}, '*');

第二个参数需要指定为’*'，表示任意域名都可以接收到消息。

2.在 UniApp 的 web-view 页面中接收消息

<template>
  <view>
    <web-view src="/hybrid/html/index.html" @message="handleMessage"></web-view>
  </view>
</template>

<script>
export default {
   
  methods