引言
通常微信小程序必不可少的會(huì)有獲取用戶信息的功能抵知，但官方出具通知了，對(duì)獲取用戶信息接口進(jìn)行了調(diào)整。
規(guī)則改晨川，小程序從業(yè)者就得跟著改~ 調(diào)整通知地址：小程序與小游戲獲取用戶信息接口調(diào)整，請(qǐng)開發(fā)者注意升級(jí)删豺。
接口調(diào)整內(nèi)容
由于收到開發(fā)者的反饋共虑，為了方便開發(fā)者更好地使用獲取用戶信息的接口，開發(fā)者仍然可以使用 wx.getUserInfo 接口獲取用戶信息呀页。
具體優(yōu)化調(diào)整如下：
- 獲取用戶頭像昵稱妈拌，第一次需要使用
button組件授權(quán)，如果已經(jīng)用組件授權(quán)了，wx.getUserInfo可直接返回用戶數(shù)據(jù)尘分，無需重復(fù)授權(quán)彈窗猜惋。 - 如果沒有用
button組件授權(quán)，wx.getUserInfo調(diào)用接口返回失敗培愁，提醒開發(fā)者需要先使用button組件授權(quán)著摔。 - 用戶可在設(shè)置中，
取消授權(quán)定续。取消授權(quán)后需重新用button組件拉起授權(quán)谍咆。
為優(yōu)化用戶體驗(yàn)，使用 wx.getUserInfo 接口直接彈出授權(quán)框的開發(fā)方式將逐步不再支持私股。從2018年4月30日開始摹察，小程序與小游戲的體驗(yàn)版、開發(fā)版調(diào)用 wx.getUserInfo 接口倡鲸，將無法彈出授權(quán)詢問框供嚎，默認(rèn)調(diào)用失敗。正式版暫不受影響旦签。開發(fā)者可使用以下方式獲取或展示用戶信息：
一查坪、小程序:
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
試用下來感覺open-data還是比較好替換的~
解決方案
app.js
// 獲取用戶信息
wx.getSetting({
success: res => {
console.info("獲取用戶信息 getSetting 回調(diào)結(jié)果:")
console.info(res)
if (res.authSetting['scope.userInfo']) {
// 已經(jīng)授權(quán)，可以直接調(diào)用 getUserInfo 獲取頭像昵稱竿秆，不會(huì)彈框
wx.getUserInfo({
success: res => {
// 可以將 res 發(fā)送給后臺(tái)解碼出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是網(wǎng)絡(luò)請(qǐng)求启摄，可能會(huì)在 Page.onLoad 之后才返回
// 所以此處加入 callback 以防止這種情況
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}
}
}),
globalData: {
userInfo: null
}
在展示用戶信息之前需要授權(quán)。
mine.wxml
<view class='page'>
<view wx:if="{{!hasUserInfo}}"> </view>
<view wx:else="{{hasUserInfo}}">
<view class="userinfo">
<image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
</view>
<!-- 除了用戶信息以外的頁面 -->
</view>
</view>
mine.js
var app = getApp()
Page({
/**
* 頁面的初始數(shù)據(jù)
*/
data: {
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo'),
},
/**
* 生命周期函數(shù)--監(jiān)聽頁面顯示
*/
onShow: function() {
var that = this
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse) {
// 能支持open-type=getUserInfo 版本的做法
// 跳轉(zhuǎn)到授權(quán)頁面
wx.navigateTo({
url: '../author/author'
})
} else {
// 在沒有 open-type=getUserInfo 版本的兼容處理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
},
/**
* 生命周期函數(shù)--監(jiān)聽頁面隱藏
*/
onHide: function() {
},
})
author.wxml
<view class='page'>
<image class='logo' src='../../images/author/betterlife.png'></image>
<text class='text_apply'>宜居生活申請(qǐng)獲得以下權(quán)限：</text>
<text class='text_warn'>獲得你的公開信息（昵稱幽钢、頭像等）</text>
<button class="author_button" type='warn' open-type="getUserInfo" bindgetuserinfo="getUserInfo" size='default'> 確認(rèn)授權(quán) </button>
</view>
author.wxss
.page {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.logo{
width: 240rpx;
height: 296.3rpx;
margin-top: 110rpx;
margin-bottom: 110rpx;
}
.text_apply{
font-size: 18px;
margin-top: 27.778rpx;
}
.text_warn{
font-size: 14px;
margin-top: 27.778rpx;
margin-bottom: 69.444rpx;
color: grey;
}
.author_button{
width: 729.17rpx;
}
author.js
getUserInfo: function (e) {
console.log(e)
app.globalData.userInfo = e.detail.userInfo
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
wx.switchTab({
url: '../mine/mine'
})
}
