小程序web-view内嵌网页分享获取标题--八零在线

小程序web-view内嵌网页分享如果获取标题和点击分享小程序跳回当前分享链接

首先在web-view组件上绑定bindmessage事件

在js文件中定义好bindmessage函数用于接收分享时触发的分享事件

bindmessage(e) {//接收web-view传递的参数
    if (e.detail.data[e.detail.data-1].title){      this.setData({//存储状态
        title: e.detail.data[0].title
      })
    }
    
  },

要想能够在分享时接收到标题等信息必须在网页中插入如下代码

继续上分享代码

onShareAppMessage(e) {
//用户分享时可获取当前的URL,即在onShareAppMessage回调中返回webViewUrl参数。
var return_url = e.webViewUrl
return {
title: this.data.title,
path: 'pages/index/index?return_url=' + encodeURIComponent(return_url),
success: function (res) {
console.log(res)
// 转发成功
},
fail: function (res) {
console.log(res)
// 转发失败
}
}
}

那如何跳回到分享时的页面呢，就是在源码加载时给web-view的src属性url变量赋值

onLoad: function () {
    var pages = getCurrentPages();
    var currentPage = pages[pages.length - 1];
    
    if (currentPage.options.return_url){
    var web_src = decodeURIComponent(currentPage.options.return_url);
    this.setData({
    src: web_src
    });
    }

参考文档：https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

赏