当前位置: 首页 > 微信相关

微信小程序前端开发群功能教程

发布日期:2020-08-12 09:08:03 分类:微信相关 阅读()来源:网络收集

好东西要多分享:

做网站就上魔艺客
摘要:微信群有小程序分享卡片,分享开发群功能的前端实现教程,拿到用户头像和昵称等基础信息

我们在一些微信群中看到过这样的小程序分享卡片:当你点进去后,会看到一个列表,里面有其他群成员的头像和相关信息。比如《王者荣耀群排行》,但是段位信息是腾讯私有的接口,我们只能拿到头像和昵称等基础信息。


首先我们要调用wx.showShareMenu进行设置,来开启是否使用带shareTicket的转发,这个shareTicket是开发群功能的关键:

wx.showShareMenu({

withShareTicket: true,

})

一般将其放在页面onShow中。

触发转发事件

如果要自定义转发按钮而不是有默认右上角的转发按钮,需要在页面中放置一个open-type=sharebutton组件:

share

接下来在页面中设置分享函数onShareAppMessage:

onShareAppMessage: function (res) {

if (res.from === 'button') {

// 来自页面内转发按钮

console.log(res.target)

}

return {

title: '自定义转发标题',

path:'/pages/test/test?id=123',

success: function(res) {

// 转发成功

console.log(res)

// 只有转发到群聊中打开才可以获取到 shareTickets 返回值,单聊没有 shareTickets

if (res.shareTickets && res.shareTickets.length>0) {

app.getShareInfo(res.shareTickets[0])

}

},

fail: function(res) {

// 转发失败

console.log(res)

}

}

}

现在就可以进行转发了,在群聊中将会看到此次分享的小程序消息卡片。每个shareTicket对应每个群并且单聊不会有该值。这里只选择一个转发,所以直接取第一个。至于app.getShareInfo是用来获取群id(openGId)的函数,我们放到后面介绍。

群成员点消息卡片

当群成员点消息卡片进入小程序后,在app.jsonShow/onLaunchoptions中可以获取到shareTicketshareTicket每次都是不一样的,比分你分享的时候获取到的跟这里获取到的不是同一个,但是会对应同一个openGId

app.js中,通过wx.getShareInfo获取encryptedDataiv,然后将其传给后台进行解析。


getDecodeEncryptedData中,当后台解析成功后,就会返回一个openGId


此时就可以将群openGId与用户openid进行绑定了,这个绑定信息也是要保存到后台的。如果后台没有保存过头像昵称信息,此时也可以将用户头像和昵称一起保存到后台。


类似于下面这样的一个接口:


// 下面只是演示代码


post({


url:'https://www.example.com/controller/bindGroupAndUser'


data:{


code,


openGId


}


})


其中的code调用wx.login获得,后台根据这个code能获取到openid。然后进行绑定。然后根据自己的需求,可能还要一个保存用户基础信息和拉取群成员信息列表的接口。


推荐阅读:微信小程序怎么制作旋转动画 微信小程序开发教程

声明: 文章内容及图片部分全部摘自网络,在此分享供读者参考和借鉴,不代表酷雷的观点。文章、图片等内容如涉嫌侵权,请联系我们删除,谢谢!带有原创标签的属于酷雷原创文章,未经允许不得转载!

标签:

我要说一说

加载中~

相关推荐

您好,很高兴为您服务!
广告合作
投诉建议
联系站长

客服热线:15821432298

扫码加好友,优惠等你来!