小程序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的方法，向小程序传递数据，小程序经过  <web-view src="{{report_src}}" bindmessage="bindGetMsg"></web-view> 而后经过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
    }
}

 

 

 

参考：http://www.javashuo.com/article/p-vpqvvehv-ba.html