1.位置授權(quán)
位置授權(quán)相對簡單挑社，可以直接調(diào)用方法wx.getLocation()就可以彈出授權(quán)框庙洼，
在調(diào)用前需要在app.json中設(shè)置用途說明
Page({
"permission": {
"scope.userLocation": {
"desc": "你的位置信息將用于xxx"
}
}
})
但是存在不少用戶會拒絕授權(quán),如果拒絕授權(quán)就不會再彈窗顿痪，而是直接進入接口 fail 回調(diào)，就要手動授權(quán)油够，我們可以通過自定義彈窗來誘導(dǎo)用戶授權(quán)蚁袭。我這里用的是wx.showMoadl確認框。
如果確認就調(diào)用wx.opensetting調(diào)出授權(quán)設(shè)置頁面
wx.showModal({
title: '提醒',
content: '您拒絕了位置授權(quán)石咬，將無法使用大部分功能揩悄，點擊確定重新獲取授權(quán)',
success(res) {
//如果點擊確定
if (res.confirm) {
wx.openSetting({ //打開設(shè)置頁
success(res) { //成功，返回頁面回調(diào)
//如果同意了位置授權(quán)則userLocation=true
if (res.authSetting["scope.userLocation"]) { //授權(quán)中如果有位置授權(quán)則執(zhí)行邏輯
/*你的代碼*/
}
}
})
}
}
})
完整代碼
wx.getLocation({
success: function(res) {
app.globalData.lat = res.latitude;
app.globalData.lon = res.longitude;
},
fail() {
wx.showModal({
title: '提醒',
content: '您拒絕了位置授權(quán)鬼悠，將無法使用大部分功能删性，點擊確定重新獲取授權(quán)',
success(res) {
//如果點擊確定
if (res.confirm) {
wx.openSetting({
success(res) {
//如果同意了位置授權(quán)則userLocation=true
if (res.authSetting["scope.userLocation"]) {
that.onLoad()
}
}
})
}
}
})
}
})
2.用戶信息授權(quán)
用戶授權(quán)步驟相對會復(fù)雜一點亏娜，因為現(xiàn)在獲取wx.getUserInfo 接口后續(xù)將不再出現(xiàn)授權(quán)彈窗。需要手動點擊去授權(quán)蹬挺，所以也是需要誘導(dǎo)用戶去點擊按鈕维贺。
<button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">確認</button>
open-type 我用到了兩種
- getUserInfo 獲取用戶信息，可以從bindgetuserinfo回調(diào)中獲取到用戶信息
- getPhoneNumber 獲取用戶手機號巴帮，可以從bindgetphonenumber回調(diào)中獲取到用戶信息（下面有）
注意:這里必須是button組件才能觸發(fā)
這里我將他封裝成了一個模擬的彈出框（樣式丑陋溯泣，自己修改），wxss就不發(fā)出來了
<!-- wxml -->
<view class='getInfo' wx:if="{{haveInfo}}">
<view class='content'>
<view class='text'>我們需要獲取您的授權(quán)信息</view>
<view class='btn_block'>
<button class='btn1' bindtap='no'>拒絕</button>
<button class='btn2' open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">確認</button>
</view>
</view>
</view>
調(diào)用bindUserInfo榕茧，如果e.detail.userInfo存在垃沦，則說明授權(quán)成功
bindGetUserInfo(e) {
//用戶點擊允許授權(quán)
if (e.detail.userInfo) {
//業(yè)務(wù)邏輯
}
授權(quán)成功后即可再調(diào)用wx.getUserInfo()，就可以獲得用戶信息
完整代碼
bindGetUserInfo(e) {
//用戶點擊允許授權(quán)
if (e.detail.userInfo) {
this.setData({
haveInfo: false
})
// 獲取用戶信息
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
//業(yè)務(wù)代碼
}
})
}
}
})
}
}
3.獲取用戶手機授權(quán)
用戶手機授權(quán)也是需要誘導(dǎo)用戶去點擊按鈕觸發(fā)的授權(quán)框雪猪，所以也是要自定義栏尚。
和獲取用戶信息的自定義框不同的是按鈕屬性
<button class='btn2' open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">確認</button>
bindgetphonenumber函數(shù)調(diào)用成功會返回三個值：
- encryptedData：包括敏感數(shù)據(jù)在內(nèi)的完整用戶信息的加密數(shù)據(jù)，詳細見加密數(shù)據(jù)解密算法
- iv：加密算法的初始向量只恨，詳細見加密數(shù)據(jù)解密算法
- cloudID：敏感數(shù)據(jù)對應(yīng)的云 ID译仗，開通云開發(fā)的小程序才會返回，可通過云調(diào)用直接獲取開放數(shù)據(jù)官觅，詳細見云調(diào)用直接獲取開放數(shù)據(jù)
其中我用到的是encryptedData纵菌、iv，將這兩個發(fā)給后端去解碼休涤，可以獲得三個值（寫入數(shù)據(jù)庫就交給后端了咱圆，就不用再多個步驟）
- phoneNumber：用戶綁定的手機號（國外手機號會有區(qū)號）
- purePhoneNumber：沒有區(qū)號的手機號
- countryCode：區(qū)號
如果獲取成功才會返回三個值，失敗則不會功氨，所以我們判斷是否授權(quán)獲取手機可以直接用那三個值判斷
我的代碼↓
//獲取用戶手機
getPhoneNumber(e) {
if (e.detail.encryptedData) {
this.setData({
havePhone: false
})
wx.request({
url: app.globalData.url + 'xiao_bindphone',
method: 'POST',
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
data: {
user_id: app.globalData.user_id,
sessionKey: app.globalData.sessionKey,
encryptedData: e.detail.encryptedData,
iv: e.detail.iv
},
success(res) {
//業(yè)務(wù)代碼
}
})
}
},
三個授權(quán)就寫到這啦序苏，下面寫下我的流程和邏輯
————————————————————————————————
如果是新用戶進入小程序的話，提交code到后端捷凄，后端在數(shù)據(jù)庫創(chuàng)建新的用戶忱详，此時的新用戶數(shù)據(jù)只有少量數(shù)據(jù)的（如后端自己創(chuàng)建的id），所以我們需要將能獲取到的值傳給后端完善數(shù)據(jù)庫跺涤。
一匈睁、判斷數(shù)據(jù)庫中此用戶是否有頭像和名稱，沒有則需要授權(quán)用戶數(shù)據(jù)（傳頭像和名稱）桶错，將得到的頭像和名稱傳到后端完善數(shù)據(jù)庫航唆，此時需要用到用戶信息的授權(quán)，即wx.getUserInfo院刁。
二糯钙、判斷數(shù)據(jù)庫中此用戶是否有手機號，沒有則調(diào)用獲取手機號授權(quán)，即getPhoneNumber超营。
三鸳玩、關(guān)于位置授權(quán)是項目需要，可調(diào)用wx.getLocation演闭。
