在本篇文章所講的用戶登錄屈扎,包括以下三點(diǎn):
- open-data獲取用戶某個信息
- wx.getUserInfo獲取用戶基本信息
- 調(diào)用微信wx.login接口禀挫,實(shí)現(xiàn)服務(wù)器端獲取openid登錄
用戶頭像和昵稱對于我們開發(fā)小程序幾乎算是剛需,那么我們應(yīng)該怎么樣正確高效的獲取&利用它們呢?
第一種:open-data獲取用戶某個信息
其實(shí)可以將open-data看作圖片或字符串,想要控制樣式在外層加上view標(biāo)簽以及相應(yīng)的class即可。
相比之前微信公眾號獲取用戶基本信息的方式帜消,這個方案還是比較走心的,如果一些小程序只是對用戶的頭像浓体、昵稱等基本信息中的某個有需求的話就可以直接拿到了泡挺,不需要和以前一樣大費(fèi)周章的調(diào)用授權(quán)去拿回來一堆用不上的東西。
還有就是這里有個小坑命浴,open-data標(biāo)簽是個行元素娄猫,如果要控制這個標(biāo)簽,例如說頭像的大小時咳促,就需要修改一下display屬性了
還有就是獲取手機(jī)號的方法了稚新,這個算是敏感數(shù)據(jù)吧,所以被小程序單獨(dú)弄出來了跪腹,
并且獲取微信用戶綁定的手機(jī)號褂删,需先調(diào)用wx.login接口。
因?yàn)樾枰脩糁鲃佑|發(fā)才能發(fā)起獲取手機(jī)號接口冲茸,所以該功能不由 API 來調(diào)用屯阀,需用 <button>
組件的點(diǎn)擊來觸發(fā)。
<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"> </button>
Page({
getPhoneNumber: function(e) {
console.log(e.detail.errMsg)
console.log(e.detail.iv)
console.log(e.detail.encryptedData)
}
})
微信小程序文檔提到
目前該接口針對非個人開發(fā)者轴术,且完成了認(rèn)證的小程序開放(不包含海外主體)难衰。需謹(jǐn)慎使用,若用戶舉報(bào)較多或被發(fā)現(xiàn)在不必要場景下使用逗栽,微信有權(quán)永久回收該小程序的該接口權(quán)限盖袭。
所以使用時還是要注意一下的
第二種:wx.getUserInfo獲取用戶基本信息
這個接口更新過可以直接使用了
wx.getUserInfo({
success: function (res) {
console.table(res)
},
fail: function (res) { },
complete: function (res) { },
})
因?yàn)槲⑿呕A(chǔ)庫更新,取消通過api調(diào)用getUserInfo的能力彼宠,并且不會出現(xiàn)授權(quán)彈框了鳄虱,如果需要,可以使用button組件的開放能力[open-type]去調(diào)用getUserInfo的文檔方法凭峡。
這個需要注意的是
請確保wx.login早于getUserInfo拙已,不僅是代碼執(zhí)行層面的早,最好是login回調(diào)成功之后才去getUserInfo摧冀,不然可能會出現(xiàn)后端解密失敗的情況倍踪,導(dǎo)致登錄失敗系宫。
第三種:調(diào)用微信wx.login接口,實(shí)現(xiàn)服務(wù)器端獲取openid登錄
wx.login({
success: res => {
console.log(res)
// res = {errMsg: "login:ok", code: "×××××××××××××××××"}
// 發(fā)送 res.code 到后臺換取 openId, sessionKey, unionId
wx.request({
url: '/wxapi/openid',
data: {
code: data.code
},
success: function (res) {
console.log('拉取openid成功', res)
wx.showModal({
title: '獲取信息',
content: JSON.stringify(res.data),
showCancel: false,
confirmText: '確定'
})
self.globalData.openid = res.data.openid
},
fail: function (res) {
console.log('拉取用戶openid失敗建车,將無法正常使用開放接口等服務(wù)', res)
}
}
})
就可以獲取到openid了扩借,作為微信開發(fā)的都知道,微信的很多接口都需要以openid去作為參數(shù)請求接口的癞志。
還有就是關(guān)于接口的問題
弄個后臺 請求一下微信的接口
'https://api.weixin.qq.com/sns/jscode2session' +
'?appid=' + config.appid +
'&secret=' + config.secret +
'&js_code=' + code +
'&grant_type=authorization_code'
傳進(jìn)去一個code往枷,然后在加上自己的appid及密鑰就可以了