微信小程序彈出用戶授權彈窗，微信小程序引導用戶授權，獲取位置經緯度

我們在開發小程序時，有些操作必須讓用戶授權。比如我們獲取用戶位置，需要用戶授權位置信息。授權操作我們需要給用戶彈窗提示，在用戶禁用某些權限時，又要引導用戶去設置頁開啓相應權限。我們這裏就以獲取經緯度爲例，來帶大家學會友好的引導用戶授權。

老規矩，先看效果圖

一，我們使用位置信息，就需要授權

 //校驗位置權限是否打開
 checkLocation() {
  let that = this;
  //選擇位置，需要用戶授權
  wx.getSetting({
   success(res) {
    if (!res.authSetting['scope.userLocation']) {
     wx.authorize({
      scope: 'scope.userLocation',
      success() {
       wx.showToast({ //這裏提示失敗原因
        title: '授權成功！',
        duration: 1500
       })
      },
      fail() {
       that.showSettingToast('需要授權位置信息');
      }
     })
    }
   }
  })
 },

首先檢驗用戶是否授權位置信息的權限“scope.userLocation”，如果有授權，我們就可以直接去獲取用戶的位置經緯度了。如果沒有授權，我們就彈窗引導用戶去設置頁。去設置頁的方法如下

 // 打開權限設置頁提示框
 showSettingToast: function (e) {
  wx.showModal({
   title: '提示！',
   confirmText: '去設置',
   showCancel: false,
   content: e,
   success: function (res) {
    if (res.confirm) {
     wx.navigateTo({
      url: '../setting/setting',
     })
    }
   }
  })
 },

由於去設置頁，需要用戶手動觸發，這裏我們就用一個setting.wxml頁作爲過過渡頁。

我們這個過渡頁的按鈕，用戶點擊後就會去真正的授權頁了。

當用戶開啓地理位置授權後。我們再點擊獲取位置，就可以獲取到用戶當前的經緯度了。

完整代碼如下

//index.js

Page({
 getLocation() {
  this.checkLocation();

  let that = this;
  wx.chooseLocation({
   success: function(res) {
    var latitude = res.latitude
    var longitude = res.longitude;
    that.setData({
     address: "經緯度：" + longitude + ", " + latitude,
    })
   }
  });
 },
 //校驗位置權限是否打開
 checkLocation() {
  let that = this;
  //選擇位置，需要用戶授權
  wx.getSetting({
   success(res) {
    if (!res.authSetting['scope.userLocation']) {
     wx.authorize({
      scope: 'scope.userLocation',
      success() {
       wx.showToast({ //這裏提示失敗原因
        title: '授權成功！',
        duration: 1500
       })
      },
      fail() {
       that.showSettingToast('需要授權位置信息');
      }
     })
    }
   }
  })
 },
 // 打開權限設置頁提示框
 showSettingToast: function (e) {
  wx.showModal({
   title: '提示！',
   confirmText: '去設置',
   showCancel: false,
   content: e,
   success: function (res) {
    if (res.confirm) {
     wx.navigateTo({
      url: '../setting/setting',
     })
    }
   }
  })
 },
})

到此我們就實現了小程序引導授權的全部功能，並且可以獲取到用戶的位置經緯度了。是不是很簡單。

如果有關於小程序的問題，可以加我微信2501902696（備註小程序）