相信刚接触微信小程序开发的人都在想 官方给出的这个是什么意思
我来解释一下吧
还记得我们在最开始使用微信小程序的时候吗? 第一次进一个微信小程序的时候会直接弹出来个框
询问我们是否允许哟用户获取信息,微信官方觉得这样不好,一上来就让客户点击一个不明所以的
允许,很多客户都会不点,用户体验度很差,所以呢,我们的微信官方,将不再允许直接弹框,
而是进入你的小程序后,你可以在首页或者我的里面设置一个`button`组件当客户点击了这个组件
我们就可以使用wx.getUserInfo这个API来获得用户的数据,而这些事情在我们创建小程序时,
微信官方已经帮我们创建好了,就是下面这张图
hasUserInfo是我们设置的一个变量,默认为false,
canIUser也是我们设置的一个变量,默认为 wx.canIUser(‘button.open-type.getUserInfo’)
wx.canIUser(“组件.属性.选择”)是这个API的用法,判断这个组件的属性的选择是否在当前版本可以用,
我们的getUserInfo函数的参数e就变为下面这个json对象(其实e就是我们button组件)
首先我们将app.js里的globalData的userInfo变量设置为button.detail.userInfo是一个json对象,方便我们在其他页面想使用用户信息用globalData即可
然后把本页面的js里的data里的userInfo也改为用户信息json对象
然后把hasUserInfo置位true, 这个是true了那我们的首页面就变成图片喽,
官方的意思是,如果我们没有经过用户授权,即点击button按钮,是不能使用wx.getUserInfo这个API的,如果使用会直接失败.
如果getSetting返回的res.authSetting[‘scope.userInfo’] 为true那么就是已经授权
为什么呢因为open-type是个神奇的属性,当我们的用户点击时就能向微信服务器发一个消息,证明授权了.
授权了就可以用wx.getUserInfo了
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}
}
})
我们在点击button组件的时候 就会把信息存好,但是,为啥我们的app.js里还要用getSetting吗,因为我们一旦退出小程序,那么我们的的app.js或者index.js都会恢复,然后我们在进来的时候,已经授权了,所以我们可以直接取获取用户信息了.
不得不说这个功能真的是让人头痛.绕了一大圈子