微信小程序如何获取群聊的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 相关文章推荐
firefox下input type=&quot;file&quot;的size是多大
Oct 24 Javascript
js简单实现标签云效果实例
Aug 06 Javascript
jQuery 1.9.1源码分析系列(十三)之位置大小操作
Dec 02 Javascript
JavaScript判断是否是微信浏览器
Jun 13 Javascript
Phaser.js实现简单的跑酷游戏附源码下载
Oct 26 Javascript
灵活使用console让js调试更简单的方法步骤
Apr 23 Javascript
浅谈Webpack多页应用HMR卡住问题
Apr 24 Javascript
JS解惑之Object中的key是有序的么
May 06 Javascript
Electron + vue 打包桌面操作流程详解
Jun 24 Javascript
bootstrapValidator表单校验、更改状态、新增、移除校验字段的实例代码
May 19 Javascript
在vue项目中利用popstate处理页面返回的操作介绍
Aug 06 Javascript
JavaScript this关键字的深入详解
Jan 14 Javascript
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
人族 Terran 基本策略
2020/03/14 星际争霸
PHP 设计模式之观察者模式介绍
2012/02/22 PHP
PHP基础陷阱题(变量赋值)
2012/09/12 PHP
CodeIgniter安全相关设置汇总
2014/07/03 PHP
php实现TCP端口检测的方法
2015/04/01 PHP
Laravel 5.3 学习笔记之 错误&amp;日志
2016/08/28 PHP
用javascript实现无刷新更新数据的详细步骤 asp
2006/12/26 Javascript
页面中js执行顺序
2009/11/09 Javascript
asp.net+js 实现无刷新上传解析csv文件的代码
2010/05/17 Javascript
一步一步制作jquery插件Tabs实现过程
2010/07/06 Javascript
Jquery拖拽并简单保存的实现代码
2010/11/28 Javascript
IE6背景图片不缓存问题解决方案及图片使用策略多个方法小结
2012/05/14 Javascript
jquery遍历select元素(实例讲解)
2013/12/31 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
2014/01/03 Javascript
H5用户注册表单页 注册模态框!
2016/09/17 Javascript
JavaScript实现的超简单计算器功能示例
2017/12/23 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
2018/04/13 Javascript
vue里面使用mui的弹出日期选择插件实例
2018/09/16 Javascript
浅谈redux, koa, express 中间件实现对比解析
2019/05/23 Javascript
react koa rematch 如何打造一套服务端渲染架子
2019/06/26 Javascript
vue中利用iscroll.js解决pc端滚动问题
2020/02/15 Javascript
vue导入.md文件的步骤(markdown转HTML)
2020/12/31 Vue.js
[04:40]2016个国际邀请赛中国区预选赛场地——华西村观战指南
2016/06/25 DOTA
Python实现远程调用MetaSploit的方法
2014/08/22 Python
python开发之list操作实例分析
2016/02/22 Python
Anaconda2 5.2.0安装使用图文教程
2018/09/19 Python
Pytoch之torchvision.transforms图像变换实例
2019/12/30 Python
python GUI库图形界面开发之PyQt5表格控件QTableView详细使用方法与实例
2020/03/01 Python
在pycharm中文件取消用 pytest模式打开的操作
2020/09/01 Python
德国前卫设计师时装在线商店:Luxury Loft
2019/11/04 全球购物
白酒市场营销方案
2014/02/25 职场文书
人力管理专业毕业生求职信
2014/02/27 职场文书
纪委立案决定书
2015/06/24 职场文书
SpringBoot整合Mybatis Generator自动生成代码
2021/08/23 Java/Android
Python实现老照片修复之上色小技巧
2021/10/16 Python
防止web项目中的SQL注入
2021/12/06 MySQL