微信小程序如何获取群聊的openGid以及名称详解


Posted in Javascript onJuly 17, 2019

背景:由于公司可能需要在微信群里面使用打卡功能,因此做了个技术调研。

方案:微信在更新分享接口后,原有的在onShareAppMessage中直接拿shareTicket已不复存在。根据最新文档显示,需要在App.onLaunch()跟App.onShow()中获取。

Demo核心代码:

index.js

Page({

 /**
  * 页面的初始数据
  */
 data: {
  openGid: ''
 },

 /**
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  let that = this
  wx.showShareMenu({
   withShareTicket: true
  })
  app.getShareTiket(function (globalData) {
   console.log('clickReload---globalData-->' + JSON.stringify(globalData))
   that.setData({
    openGid: globalData.openGid
   })
  })
 },
 clickReload: function () {
  let that = this
  app.getShareTiket(function (globalData) {
   console.log('clickReload---globalData-->' + JSON.stringify(globalData))
   that.setData({
    openGid: globalData.openGid
   })
  })
 }
})

index.wxml

<!--index.wxml-->
<view wx:if="{{openGid}}" class='groupName'>
 群名称:<open-data type="groupName" open-gid="{{openGid}}"></open-data>
</view>

<view wx:else>
 <button bindtap='clickReload'>点击加载群名称</button>
</view>

<view>{{openGid ? openGid : '无'}}</view>

app.js

//app.js
App({
 globalData: {
  shareTicket: '',
  openGid: ''
 },
 onLaunch: function (options) {

 },
 onShow: function (options) {
  let that = this
  if (options && options.scene == 1044) {
   that.globalData.shareTicket = options.shareTicket
  }
  console.log('onShow---options=--->' + JSON.stringify(options))
 },
 getShareTiket: function (cb) {
  let that = this
  // 展示本地存储能力
  if (that.globalData.shareTicket) {
   wx.getShareInfo({
    shareTicket: that.globalData.shareTicket,
    success: function (res) {
     console.log('getShareTiket---shareTicket-->' + JSON.stringify(res))
     let js_encryptedData = res.encryptedData
     let js_iv = res.iv
     wx.login({
      success: function (res) {
       let js_code = res.code
       console.log('code-->' + js_code)
       wx.request({
        url: 'xxxxxxxx',
        method: 'POST',
        data: {
         code: js_code,
         appId: 'xxxxx',
         encryptedData: js_encryptedData,
         iv: js_iv
        },
        success: function (res) {
         that.globalData.openGid = res.data.openGId
         console.log('getShareTiket---openGid' + that.globalData.openGid)
         typeof cb == "function" && cb(that.globalData)
        },
        fail: function (err) {
         console.log('getShareTiket---err' + JSON.stringify(err))
        }
       })
      }
     })
    }
   })
  } else {
   console.log('不存在shareTicket')
  }
 }
})

注意事项

1:必须调用这个接口wx.showShareMenu({withShareTicket: true}),否则在App.onLaunch()跟App.onShow()时,你拿不到shareTicket.

2:微信开发者工具可以模拟1044的场景,但是不会显示群名称,因为你不在群里。所以测试的时候,自己拉个微信群,然后分享到测试群,就能拿到群名称。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery 绑定回车动作扑捉回车键触发的事件
Mar 26 Javascript
Node.js实用代码段之获取Buffer对象字节长度
Mar 17 Javascript
基于BootStrap Metronic开发框架经验小结【五】Bootstrap File Input文件上传插件的用法详解
May 12 Javascript
js轮播图代码分享
Jul 14 Javascript
基于angular2 的 http服务封装的实例代码
Jun 29 Javascript
es6新特性之 class 基本用法解析
May 05 Javascript
vue中倒计时组件的实例代码
Jul 06 Javascript
手把手教你写一个微信小程序(推荐)
Oct 17 Javascript
利用原生JS实现data方法示例代码
May 28 Javascript
JS实现扫码枪扫描二维码功能
Jan 03 Javascript
nuxt 自定义 auth 中间件实现令牌的持久化操作
Nov 05 Javascript
vue使用refs获取嵌套组件中的值过程
Mar 31 Vue.js
vue+django实现一对一聊天功能的实例代码
Jul 17 #Javascript
微信小程序从注册账号到上架(图文详解)
Jul 17 #Javascript
js设置默认时间跨度过程详解
Jul 17 #Javascript
Vue 前端实现登陆拦截及axios 拦截器的使用
Jul 17 #Javascript
初试vue-cli使用HBuilderx打包app的坑
Jul 17 #Javascript
移动端吸顶fixbar的解决方案详解
Jul 17 #Javascript
基于webpack4+vue-cli3项目实现换肤功能
Jul 17 #Javascript
You might like
用libtemplate实现静态网页生成
2006/10/09 PHP
适用于php-5.2 的 php.ini 中文版[金步国翻译]
2011/04/17 PHP
php中显示数组与对象的实现代码
2011/04/18 PHP
ecshop实现smtp发送邮件
2015/02/03 PHP
Yii2增加验证码步骤详解
2016/04/25 PHP
用Javascript 和 CSS 实现脚注(Footnote)效果
2009/09/09 Javascript
jquery 经典动画菜单效果代码
2010/01/26 Javascript
jquery each()源代码
2011/02/14 Javascript
jquery 使用点滴函数代码
2011/05/20 Javascript
JS 操作Array数组的方法及属性实例解析
2014/01/08 Javascript
checkbox选中与未选中判断示例
2014/08/04 Javascript
20条学习javascript的编程规范的建议
2014/11/28 Javascript
jQuery修改class属性和CSS样式整理
2015/01/30 Javascript
Web前端开发工具——bower依赖包管理工具
2016/03/29 Javascript
js获取所有checkbox的值的简单实例
2016/05/30 Javascript
最细致的vue.js基础语法 值得收藏!
2016/11/03 Javascript
VUE JS 使用组件实现双向绑定的示例代码
2017/01/10 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
2017/11/14 jQuery
JS实现百度搜索框
2021/02/25 Javascript
[08:02]DOTA2牵红线 zhou神抱得美人归
2014/03/22 DOTA
Python内置函数之filter map reduce介绍
2014/11/30 Python
itchat接口使用示例
2017/10/23 Python
python中使用正则表达式的后向搜索肯定模式(推荐)
2017/11/11 Python
Tesserocr库的正确安装方式
2018/10/19 Python
python 列表中[ ]中冒号‘:’的作用
2019/04/30 Python
Python中的 is 和 == 以及字符串驻留机制详解
2019/06/28 Python
python模拟哔哩哔哩滑块登入验证的实现
2020/04/24 Python
如何理解Python中的变量
2020/06/01 Python
Python实现列表索引批量删除的5种方法
2020/11/16 Python
荷兰电脑专场:Paradigit
2018/05/05 全球购物
美国婴儿用品及配件购买网站:Munchkin
2019/04/03 全球购物
小学社团活动总结
2014/06/27 职场文书
小学生优秀评语
2014/12/29 职场文书
六一儿童节新闻稿
2015/07/17 职场文书
CSS3常见动画的实现方式
2021/04/14 HTML / CSS
Python中rapidjson参数校验实现
2021/07/25 Python