微信小程序如何获取群聊的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 相关文章推荐
html5的自定义data-*属性和jquery的data()方法的使用示例
Aug 21 Javascript
js实现感应鼠标图片透明度变化的方法
Feb 20 Javascript
Bootstrap每天必学之下拉菜单
Nov 25 Javascript
AngularJS 中的指令实践开发指南(一)
Mar 20 Javascript
JS获取一个未知DIV高度的方法
Aug 09 Javascript
JavaScript中的普通函数和箭头函数的区别和用法详解
Mar 21 Javascript
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 jQuery
VsCode插件整理(小结)
Sep 14 Javascript
讲解vue-router之什么是嵌套路由
May 28 Javascript
webpack4.0 入门实践教程
Oct 08 Javascript
jQuery点击页面其他部分隐藏下拉菜单功能
Nov 27 jQuery
vue动态循环出的多个select出现过的变为disabled(实例代码)
Nov 10 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中session过期时间设置及session回收机制介绍
2014/05/05 PHP
php连接odbc数据源并保存与查询数据的方法
2014/12/24 PHP
PHP多线程编程之管道通信实例分析
2015/03/07 PHP
PHP获取Exif缩略图的方法
2015/07/13 PHP
Laravel基础-关于引入公共文件的两种方式
2019/10/18 PHP
js或者jquery判断图片是否加载完成实现代码
2013/03/20 Javascript
jquery放大镜效果超漂亮噢
2013/11/15 Javascript
javascript中的self和this用法小结
2014/02/08 Javascript
JavaScript中的console.group()函数详细介绍
2014/12/29 Javascript
AngularJS中$http使用的简单介绍
2017/03/17 Javascript
微信小程序商城项目之淘宝分类入口(2)
2017/04/17 Javascript
微信小程序学习之数据处理详解
2017/07/05 Javascript
NodeJS加密解密及node-rsa加密解密用法详解
2018/10/12 NodeJs
微信小程序实现动态显示和隐藏某个控件功能示例
2018/12/14 Javascript
Vue 解决多级动态面包屑导航的问题
2019/11/04 Javascript
JS使用Chrome浏览器实现调试线上代码
2020/07/23 Javascript
通过实例解析json与jsonp原理及使用方法
2020/09/27 Javascript
[03:59]DOTA2英雄梦之声_第07期_水晶室女
2014/06/23 DOTA
使用Python的Flask框架表单插件Flask-WTF实现Web登录验证
2016/07/12 Python
Python科学计算之Pandas详解
2017/01/15 Python
requests和lxml实现爬虫的方法
2017/06/11 Python
名片管理系统python版
2018/01/11 Python
python调用摄像头显示图像的实例
2018/08/03 Python
对python中的 os.mkdir和os.mkdirs详解
2018/10/16 Python
Python实现简单层次聚类算法以及可视化
2019/03/18 Python
python实现批量nii文件转换为png图像
2019/07/18 Python
python join方法使用详解
2019/07/30 Python
Django文件存储 自己定制存储系统解析
2019/08/02 Python
Python参数传递机制传值和传引用原理详解
2020/05/22 Python
Python将字典转换为XML的方法
2020/08/01 Python
双语教学实施方案
2014/03/23 职场文书
大专毕业生求职信
2014/07/05 职场文书
党在我心中演讲稿
2014/09/02 职场文书
大学班长竞选稿
2015/11/20 职场文书
反腐倡廉心得体会2016
2016/01/13 职场文书
spring cloud 配置中心native配置方式
2021/09/25 Java/Android