2021-02-06 让微信小程序和webviewH5实现互相通讯（demo）

在微信小程序里，webviewH5向miniProgram通讯只能通过 postMessage 函数

然而这个函数却很鸡肋，小程序官方文档是这样描述的： 向小程序发送消息，会在特定时机（小程序后退、组件销毁、分享）触发组件的message事件

而且小程序官方文档里没有提到miniProgram如何向webviewH5通讯

在这个demo中, 展示了我是如何让webviewH5和miniProgram互相通讯

其实原理很简单:

success

failure

cancel

https://github.com/abu3389/wx_app_webview

附加: Uniapp与webview通信用法

在web-view加载的本地及远程HTML中调用uni的API及网页和vue页面通讯

https://ask.dcloud.net.cn/article/id-35083__page-9

应用场景：小程序webview加载一个h5广告页，倒计时结束或者点击跳过按钮，跳转指定小程序某个页面（如首页）

第一步：H5页面引入小程序微信sdk

第二步：

第三步：小程序新建一个页面调用webview组件（暂时用ip地址测试，上线请配置业务域名等信息）

h5跳转小程序就是这么简单，但有一点要注意，那就是h5页面跳转小程序页面路径得是相对路径。

错误示例：

正确示例：

PS：作为一个小白，被这块坑了一天才发现问题所在，只有相对路径才会跳转成功，绝对路径是不会跳转的。

最近被支付宝小程序内嵌H5无法上传图片折磨到没脾气，H5本身上传图片没问题，但是嵌套在小程序中就无法上传。

在调试过程中发现可能是formData参数无法传送给后台造成的，试了很多解决方法都不行，最后只能利用web view通信方法以及与支付宝API相结合来解决。

首先，在H5上传图片时调用my.chooseImage方法：

由于在H5中无法使用my.uploadFile方法，所以上传至后台 *** 作需要在支付宝小程序中进行

支付宝小程序接收到路径后，调用my.uploadFile方法进行图片上传

最后，在H5 my.onMessage函数中接收小程序传来的图片地址，进行页面渲染

---