web-view postMessage 如何用bindMessage接收
发布于 6 年前 作者 zhengmin 1339 次浏览 来自 问答

web-view postMessage 如何用bindMessage接收

例如

wx.miniProgram.postMessage({ data: {foo: 'bar'} })

如何用 bindmessage 接收?

谢谢~

10 回复

实在不能理解这个“特定时机”,本来是想用来做一些H5页面在小程序中的功能过度,让这些嵌入的少量网页更加符合小程序的交互或者应用规范的,但是现在复杂场景中目前的web-view  api实在是太弱了~

我开发过程中遇到几个bindmessage的神坑这里总结一下:

  1. 在<web-view>页面右上角分享时先触发了onShareAppMessage事件而不是预想的bindmessage,在开发者工具内调试功能正常,但手机实际执行时先触发了onShareAppMessage事件,跳过了bindmessage。

解决:利用组件销毁条件,wx.miniProgram.redirectTo() 回一个新的小程序页面,再在页面内做按钮分享。

  1. <web-view>组件的 bindmessage属性真机不触发问题。

解决:是由于部分Android机不接受非object传回的data导致不触发。为了兼容,将wx.miniProgram.postMessage()写成如下形式:

       wx.miniProgram.postMessage(data:{key:value});

@刘君

bindmessage 接收网页 postMessage 传递的数据是画面销毁等情况才触发,我的理解是webview的画面都销毁了才触发,那谁来接收。

实在是不能理解这个“特定时机”的应用场景是怎么样的

我想问下 小程序后退 这个特定时机  具体是怎么样的,我H5 postMessage之后 立马

wx.miniProgram.switchTab 到小程序首页,让后需要 再回退到上一个页面才出发这个条件

我换个问法,为什么必须是“特定时机”,而不是即时收到?

传回数据可以应用一些什么样的场景?

<web-view bindmessage=“bindGetMsg” src="{{url}}"></web-view>

js

bindGetMsg(e) {

    console.log(e.detail)

}

我测试并没有拿到数据

比如你通过postmessage把数据传过去了 然后点击分享就能收到消息了

回到顶部