【微信小程序】獲取用戶地理位置權限，二次請求受權，逆解析獲取地址

摘要：微信小程序內獲取用戶地理位置信息受權，被拒絕後二次獲取，獲取權限後逆解析獲得用戶所在省市區等..

場景：商城類小程序，在首頁時需展現附近門店，即用戶剛進入小程序時就須要獲取到用戶位置信息

step1

在小程序中若要獲取用戶地理位置信息，需獲得用戶明確受權，且聲明用途，因此首先在app.json中配置聲明

參見（https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/authorize.html）

"permission": { "scope.userLocation": { "desc": "你的位置信息將用於獲取附近門店" } }

 

step2

聲明以後便可調用   wx.authorize  向用戶申請受權，用戶贊成以後 調用    wx.getLocation   獲得經緯度並作下一步處理

 

參見（https://developers.weixin.qq.com/miniprogram/dev/api/open-api/authorize/wx.authorize.html）

//能夠經過 wx.getSetting 先查詢一下用戶是否受權了 "scope.userLocation" 這個 scope，也可直接調用wx.authorize請求受權； wx.getSetting({ success(res) {// 查看全部權限 let status = res.authSetting['scope.userLocation']// 查看位置權限的狀態，此處爲初次請求，因此值爲undefined if (!status) {// 若是是首次受權(undefined)或者以前拒絕受權(false) wx.authorize({ // 發起請求用戶受權 scope: 'scope.userLocation', success() {// 用戶容許了受權 wx.getLocation({ // 請求位置信息 type: 'gcj02', success (res) { console.log(res, 95);// 獲得位置信息（經緯度，速度等等），====>>>>>請求附近門店 } }) } }) } } })

step3

兼容用戶拒絕受權的場景：若用戶可能會點擊不容許，咱們是拿不到位置信息的，並且咱們再次調用  wx.authorize  請求位置受權，上面的彈框是不會再次出現的，除非用戶刪除小程序後再次進入 ，那若是咱們還須要再次向用戶申請受權呢？

噹噹噹當~

這時咱們就須要用到wx.openSetting了，這個api能夠直接跳轉打開設置頁面，引導用戶受權

具體代碼以下：

wx.openSetting({ success (data) { if (data.authSetting["scope.userLocation"] == true) { wx.showToast({ title: '受權成功', icon: 'success', duration: 2000, success () {} }) } } })

 

 用戶受權以後，咱們就能夠再次 使用 wx.getLocation 來獲取位置信息了

step4

經過經緯度，逆解析獲取用戶城市

這裏使用的是百度地圖的api，使用方法很是簡單，調用接口，傳入經緯度，就能夠獲得省市區，甚至街道啦（可是街道不怎麼準，省市區通常也夠用了）

// 百度地圖的密鑰請自行註冊。。。
wx.request({ url: 'http://api.map.baidu.com/geocoder/v2/?ak=你的密鑰&location=' + latitude + ',' + longitude + '&output=json', data: {}, header: { 'Content-Type': 'application/json' }, success: function (ops) { wx.setStorageSync('province', ops.data.result.addressComponent.province)//把位置信息存起來 wx.setStorageSync('city', ops.data.result.addressComponent.city)// 把位置信息存起來 }, fail: function (resq) { wx.showModal({ title: '信息提示', content: '請求失敗', showCancel: false, confirmColor: '#f37938' }); }, complete: function () {} })

 

今天的課就上到這裏了，各位同窗再見！

留個微信，歡迎交流