体验微信小程序分享朋友圈功能

发布于 2020-07-16  3.74k 次阅读


之前被龙大说过的不会开放微信分享朋友圈的功能『可能是谣传 :evil: 』,

最近被突然放开了,多突然呢?以至于bilibili京东购物这些大厂都没有尝到鲜『可能是不想』,

那这里就先体验一下,也并不是花哨的功能,仅仅是个和微信内置浏览器分享一样的一个小模块,

微信小程序文档提供官方api,直接调就可以了:

未启用:

点击右上角菜单,可以看到分享朋友及朋友圈按钮为灰色,

体验微信小程序分享朋友圈功能

已启用:

显而易见,和普通的微信端分享一模一样~

体验微信小程序分享朋友圈功能

调用过程:

需要注意:这个功能目前还未处于完全放开阶段,也就意味着有部分限制:微信需要更新到最新版本,目前最新版本应该是7.0.16,并且功能因机型差异而有不同范围的灰度覆盖;其次是IOS系统目前不支持。

1.建议下载并打开最新的开发者工具,将本地的调试基础库设置到2.11.3及以上:

体验微信小程序分享朋友圈功能

2.在需要转发的页面调用官方的api:

参考官方的示例:

wx.showShareMenu({
  withShareTicket: true,
  menus: ['shareAppMessage', 'shareTimeline']
})

调用的话onload一下就可以了,

或者可以用官方的事件处理函数:

Page({
  onShareAppMessage: function (res) {
    if (res.from === 'button') {
      // 来自页面内转发按钮
      console.log(res.target)
    }
    return {
      title: '自定义转发标题',
      path: '/page/user?id=123'
    }
  }
})

其中pathtitle是可以自定义的,直接在对应页面加上即可,

以上两种方法都可实现,

在模拟器中可以看下分享效果,点击链接就可以跳转到小程序页面了:

体验微信小程序分享朋友圈功能

最后引用下官方文档的一些注意事项吧:

1."shareAppMessage"表示“发送给朋友”按钮,"shareTimeline"表示“分享到朋友圈”按钮

2.显示“分享到朋友圈”按钮时必须同时显示“发送给朋友”按钮,显示“发送给朋友”按钮时则允许不显示“分享到朋友圈”按钮

还有值得注意的是,此次分享到朋友圈功能支持的是单页模式,也就是你把这个api加到了哪个页面,对应的页面才能被你分享,底部会提供一个导航栏引导进入当前小程序,具体界面可以实践体验。 :lol: 

体验微信小程序分享朋友圈功能

更为详尽的可以参考微信小程序开发文档:

https://developers.weixin.qq.com/miniprogram/dev/api/

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html


電光石火 正面突破。 日進月歩 百花繚乱。 順風満帆 天真爛漫。