小程序中用webview中的页面与小程序交互

需求是这样的，我需要在我的微信小程序上用webview加载一个第三方的h5页面，是用vue3做的，这个h5页面有一个下载pdf文件的功能，问题来了，这是人家h5页面的下载文件，但在我的小程序的webview里就不行作用了，我想到的办法就是，客户点下载文件按钮时，我让h5把pdf的文件url给我，我再通过小程序的方法来下载文件。

webview文件代码 ：jumpUrl中是要展示的h5页面的地址。

><view>
<web-view :src="jumpUrl" @load="bindload"  @message="handleMessage" @error="binderror"></web-view>
</view>
</template>

<script>
    export default {
    data() {
        return {
            jumpUrl:''
        }
    },
    async onLoad(){
        this.jumpUrl=uni.getStorageSync('jumpUrl')
    },
        methods:{
            async handleMessage(event) {
                console.log("handleMessage3")
                console.log('从H5接收到的数据:33', event.detail.data);
                let data=event.detail.data[0].url
                console.log(data)
                uni.downloadFile({
                url: data,
                  success: function (res) {
                  console.log("成功!")
                  console.log(res)
                var filePath = res.tempFilePath;
                uni.openDocument({
                  filePath: filePath,
                  showMenu: true,
                  success: function (res) {
                console.log('打开文档成功');
                  },
                  fail(err) {
                  console.log("失败了")
                  uni.showToast({
                   icon:'none',
                   title:err
                  })
                   console.log(err);
                  }
                });
                  }
                }); 
             
            },
            bindload(event){
                console.log("加载完成!!!")
                console.log(event)
            },
            binderror(){
                console.log("加载失败")
            },
            download(){
                console.log("sss")
            }
        }
    }
</script>

<style scoped>
    .xxx{position: fixed;bottom:10vh;right:2vh;z-index: 999;}
</style>

下面是h5页面代码，用的vue3：

需要先安装：npm install weixin-js-sdk -S

import wx from "weixin-js-sdk"
const handleClick=()=>{
  console.log('点击')
       console.log("ssss")
       alert("在打开页面点击右上角的...，然后'保存到手机'即可 ！！")
        wx.miniProgram.navigateBack({delta: 1} as any)
        wx.miniProgram.postMessage({
          data: {url: "https://www.xxxx.com/1.pdf"}
          })

}
</script>

<template>
  <div>
    <button @click="handleClick">点击</button>
  </div>
</template>

<style scoped>

</style>