小程序新方法 open-type获取头像昵称

小程序自上线以来,官方一直在调整API,因此也出现了一批被废弃的接口,作为程序员的我们,此时此刻千万不能为这不断的变化而感到头疼,应当与时俱进,不断的更新自己的知识储备和应用技能。

参考文档:https://developers.weixin.qq.com/miniprogram/dev/component/open-data.html

以下是原公告:

为优化用户体验,使用 wx.getUserInfo 接口直接弹出授权框的开发方式将逐步不再支持。从2018年4月30日开始,小程序与小游戏的体验版、开发版调用 wx.getUserInfo 接口,将无法弹出授权询问框,默认调用失败。正式版暂不受影响。

开发者可使用以下方式获取或展示用户信息:

一、小程序

1、使用 button 组件,并将 open-type 指定为 getUserInfo 类型,获取用户基本信息。

详情参考文档:https://developers.weixin.qq.com/miniprogram/dev/component/button.html

2、使用 open-data 展示用户基本信息。

详情参考文档:https://developers.weixin.qq.com/miniprogram/dev/component/open-data.html

新的方法的使用

wxml:

<button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo" >授权登录</button>

js:

Page({
  data: {},
  bindGetUserInfo: function(e) {
    var that = this;
    //此处授权得到userInfo
    console.log(e.detail.userInfo);
    //接下来写业务代码

    //最后,记得返回刚才的页面
    wx.navigateBack({
      delta: 1
    })
  }
})

效果如图所示:控制台之中打印出昵称,微信头像等个人信息。

再来一波demo示范一下

wxml:

<button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="onGotUserInfo">获取用户信息</button>

js:

var pageObject = {
  data: {
  
  },
  
  onGotUserInfo: function (e) {
    console.log(e.detail.errMsg)
    console.log(e.detail.userInfo)
    console.log(e.detail.rawData)
  },
}

Page(pageObject)

效果如下:控制台之中打印出昵称,微信头像等个人信息。

原文作者:祈澈姑娘
技术博客:https://www.jianshu.com/u/05f416aefbe1
90后前端妹子,爱编程,爱运营,爱折腾。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家加入群聊,一起探讨交流。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 每天的学习记录,可能有的地方写的不对,因为刚学,以后发现错的话会回来改掉整体流程 https://develope...
    有点健忘阅读 4,795评论 0 7
  • 1.小程序起步 (1)点击https://mp.weixin.qq.com/wxopen/waregister?a...
    GXW_Lyon阅读 3,439评论 0 0
  • 小程序官方声明getUserInfo调整 为优化用户体验,使用 wx.getUserInfo 接口直接弹出授权框的...
    骚包霸天虎阅读 7,332评论 1 5
  • 阴雨不断的周末,头痛了一整天 连续多天都丢失了睡眠 所以每晚都需要酒精来入睡 酒精真的像极了毒药,却又是忘忧解愁的...
    2416a46be4fc阅读 246评论 0 0
  • 0.对于堆我们首先考虑 最小堆10/ 20 30/ 40 60可以看出一个完全二叉树放在 一位数组里面存储 ...
    LeeDev阅读 348评论 0 0