小程序web-view wx.miniProgram.postMessage 坑记录

　　web-view吧，其实微信官方应该是非常不支持在小程序上嵌套web的，它希望你直接用小程序上的代码，而放弃web的实现，当然，也是为了防止用小程序去嵌套别的广告页面。所以官方对web-view的操作是，它永远是界面的最上层及z-index最大，而且web-view只能全屏显示。从而，就可以在web-view之上嵌套任何控件，而官方提供web-view与网页之间的交互，只有src和bindmessage，同时还有一些跳转及在js中调用相关代码（wx.miniProgram.navigateTo、wx.miniProgram.navigateBack、wx.miniProgram.switchTab、wx.miniProgram.reLaunch、wx.miniProgram.redirectTo）让开发者可以从web-view的页面跳转到别的页面，还有一个获取当前环境的方法wx.miniProgram.getEnv（其实这个方法也只能用在小程序内，小程序外是无法执行的，所以其实也没有什么判断对错的操做）。

　　可能更多人会把注意力放到bindmessage和上，按照文档上写的，Js可以通过wx.miniProgram.postMessage的方法，向小程序传递数据，小程序通过  然后通过bindGetMsg方法获取到到相关参数，但这是一个无底之坑，因为bindGetMsg这个方法只能在生命周期处于不可操着的状态也就是在onHide这个状态才会被调用，也就是这个不是实时监听的。做到这里就有点尴尬了，这样所谓的“分享”操作也无法实现了，但项目需要这样的操作怎么办，我的解决办法，也就跟以前微信打开网页的操作一样，在网页上提示点击右上角转发。这个也是做微信服务号得出的结果。

 

转发兼容IOS方法：

h5页面每次跳转页面 时　

wx.miniProgram.postMessage()

 

小程序分享

 1.wxml:

<web-view src="{{src}}" bindmessage="bindmessage">web-view>

2.js:

bindmessage:function(e){
    console.log("获取推送消息");
    console.log(e.detail)
    this.setData({
        history:e.detail.data[e.detail.data.length-1]
   })
},

onShareAppMessage: function (res) {
    return {
        title: '标题',
        path: this.data.history
    }
}

 

 

 

参考：https://blog.csdn.net/huangpb123/article/details/80588693

转载于:https://www.cnblogs.com/zjhblogs/p/9896104.html