微信小程序如何获取群聊的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 相关文章推荐
让JavaScript拥有类似Lambda表达式编程能力的方法
Sep 12 Javascript
js中widow.open()方法使用详解
Jul 30 Javascript
详解JavaScript对象序列化
Jan 19 Javascript
jQuery EasyUI 获取tabs的实例解析
Dec 06 Javascript
jQuery中的siblings()是什么意思(推荐)
Dec 29 Javascript
js实现密码强度检验
Jan 15 Javascript
Mac系统下Webstorm快捷键整理大全
May 28 Javascript
Vue的MVVM实现方法
Aug 16 Javascript
Vue中使用vue-i18插件实现多语言切换功能
Apr 25 Javascript
关于微信小程序bug记录与解决方法
Aug 15 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
Apr 03 Javascript
JS PHP字符串截取函数实现原理解析
Aug 29 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
使用php判断网页是否gzip压缩
2013/06/25 PHP
PHP cdata 处理(详细介绍)
2013/07/05 PHP
新浪的图片新闻效果
2007/01/13 Javascript
表单提交时自动复制内容到剪贴板的js代码
2007/03/16 Javascript
THREE.JS入门教程(2)着色器-上
2013/01/24 Javascript
让IE8浏览器支持function.bind()方法
2014/10/16 Javascript
JS获取图片高度宽度的方法分享
2015/04/17 Javascript
jquery小火箭返回顶部代码分享
2015/08/19 Javascript
Node.js巧妙实现Web应用代码热更新
2015/10/22 Javascript
原生JS实现首页进度加载动画
2016/09/14 Javascript
微信小程序page的生命周期和音频播放及监听实例详解
2017/04/07 Javascript
JavaScript数据结构中栈的应用之表达式求值问题详解
2017/04/11 Javascript
温故知新——JavaScript中的字符串连接问题最全总结(推荐)
2017/08/21 Javascript
浅谈React中组件间抽象
2018/01/27 Javascript
jquery实现Ajax请求的几种常见方式总结
2019/05/28 jQuery
小程序实现上下移动切换位置
2019/09/23 Javascript
layui.tree组件的使用以及搜索节点功能的实现
2019/09/26 Javascript
JS创建自定义对象的六种方法总结
2020/12/15 Javascript
python实现绘制树枝简单示例
2014/07/24 Python
python基于urllib实现按照百度音乐分类下载mp3的方法
2015/05/25 Python
Python爬虫利用cookie实现模拟登陆实例详解
2017/01/12 Python
解决python os.mkdir创建目录失败的问题
2018/10/16 Python
Python3 单行多行万能正则匹配方法
2019/01/07 Python
获取Pytorch中间某一层权重或者特征的例子
2019/08/17 Python
Python实现Keras搭建神经网络训练分类模型教程
2020/06/12 Python
python脚本第一行如何写
2020/08/30 Python
Hotels.com香港酒店网:你的自由行酒店订房专家
2018/01/22 全球购物
Under Armour安德玛中国官网:美国高端运动科技品牌
2018/03/09 全球购物
项目经理任命书
2014/06/04 职场文书
创先争优标语
2014/06/27 职场文书
经营目标管理责任书
2014/07/25 职场文书
学校党的群众路线教育实践活动总结材料
2014/10/30 职场文书
2015年幼儿园大班工作总结
2015/04/25 职场文书
学生会招新宣传语
2015/07/13 职场文书
终止合同协议书范本
2016/03/22 职场文书
react 项目中引入图片的几种方式
2021/06/02 Javascript