小程序webview如何实现自定义分享功能？
发布于 7 年前 作者 duanxia 14088 次浏览 来自 官方Issues

小程序的webview中的H5页面要实现分享功能，分享一个于小程序无关的外部H5页面给微信好友，请问如何实现

5 回复

jssdk. 公众号分享

求问 最后怎么解决的

你想以什么样的形式分享出去？小程序自带分享只能是小程序卡片，我的做法是在H5里将想要分享的H5页面链接发送给小程序，小程序分享的时候就用这个链接。

bindmessage 网页向小程序 postMessage 时，会在特定时机（小程序后退、组件销毁、分享）触发并收到消息。e.detail = { data }，data是多次 postMessage 的参数组成的数组

h5 jssdk

wx.miniProgram.postMessage({
    data: {
        title: window.document.title,
        //desc: document.querySelector('meta[name=description]').content
    }
});

wxml

<web-view src="{{url}}" bindmessage="bindmessage" binderror="binderrorLoad" bindload="bindloading"></web-view>

wxjs

bindmessage(e) {//接收web-view传递的参数
        this.setData({//存储状态
            CurrentTitle : e.detail.data[0].title
        })
 
    }
onShareAppMessage: function(res){
 return {
            //res.webViewUrl这就是web-view中的网址
            title: CurrentTitle,
            path: res.webViewUrl,
            imageUrl: shareImageUrl,
            success: function() {
                // 转发成功
                wx.showToast({
                    title: '分享成功~',
                    icon: 'success',
                    duration: 1800
                })
            },
            fail: function() {
                 })
            }
        }
}

和正常的小程序转发是一样的啊

回到顶部