微信小程序如何获取群聊的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 相关文章推荐
IE 条件注释详解总结(附实例代码)
Aug 29 Javascript
javascript中caller和callee详解
Aug 10 Javascript
jQuery+CSS实现的网页二级下滑菜单效果
Aug 25 Javascript
浅析JavaScript 调试方法和技巧
Oct 22 Javascript
jQuery实现布局高宽自适应的简单实例
May 28 Javascript
AngularJS过滤器filter用法实例分析
Nov 04 Javascript
Vue.js tab实现选项卡切换
May 16 Javascript
Bootstrap treeview实现动态加载数据并添加快捷搜索功能
Jan 07 Javascript
webpack 如何解析代码模块路径的实现
Sep 04 Javascript
java和js实现的洗牌小程序
Sep 30 Javascript
详解Typescript里的This的使用方法
Jan 08 Javascript
详解vue之自行实现派发与广播(dispatch与broadcast)
Jan 19 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
一个简单的自动发送邮件系统(二)
2006/10/09 PHP
ThinkPHP中create()方法自动验证表单信息
2017/04/28 PHP
Windows下wamp php单元测试工具PHPUnit安装及生成日志文件配置方法
2018/05/28 PHP
PHP实现简单的协程任务调度demo示例
2020/02/01 PHP
关于PHP求解三数之和问题详析
2020/11/09 PHP
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
页面载入结束自动调用js函数示例
2013/09/23 Javascript
浅谈Javascript中的Function与Object
2015/01/26 Javascript
javascript实现相同事件名称,不同命名空间的调用方法
2015/06/26 Javascript
JS遍历数组及打印数组实例分析
2016/01/21 Javascript
AJAX实现瀑布流触发分页与分页触发瀑布流的方法
2016/05/23 Javascript
解决vue-cli3 使用子目录部署问题
2018/07/19 Javascript
详解Webpack-dev-server的proxy用法
2018/09/08 Javascript
vue2.x 对象劫持的原理实现
2020/04/19 Javascript
Node.JS如何实现JWT原理
2020/09/18 Javascript
[52:31]VP vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python缩进和冒号详解
2016/06/01 Python
git进行版本控制心得详谈
2017/12/10 Python
Python函数参数操作详解
2018/08/03 Python
关于pytorch多GPU训练实例与性能对比分析
2019/08/19 Python
详解python tkinter模块安装过程
2020/01/06 Python
css3 flex实现div内容水平垂直居中的几种方法
2020/03/27 HTML / CSS
html5 Canvas画图教程(1)—画图的基本常识
2013/01/09 HTML / CSS
美国领先的汽车轮胎和轮毂供应商:TireBuyer
2016/07/21 全球购物
Fossil美国官网:化石手表、手袋、首饰及配饰
2019/02/17 全球购物
国际贸易专业推荐信
2013/11/15 职场文书
优秀志愿者事迹材料
2014/02/03 职场文书
《临死前的严监生》教学反思
2014/02/13 职场文书
大学生学雷锋活动总结
2014/06/26 职场文书
学校门卫岗位职责范本
2014/06/30 职场文书
中学学校门卫岗位职责
2014/08/15 职场文书
结对共建协议书
2014/08/20 职场文书
初中差生评语
2014/12/29 职场文书
签证工作证明模板
2015/06/15 职场文书
Go语言操作数据库及其常规操作的示例代码
2021/04/21 Golang
在Django中使用MQTT的方法
2021/05/10 Python