微信小程序开发——小程序API获取用户位置及异常流处理完整示例

前言：

小程序需要添加一个定位功能，主要的就是获取用户位置的经纬度，然后根据用户经纬度进行一些判断操作。

在小程序提供的Api中，获取用户定位信息的主要Api是 wx.getLocation（obj） 。但是使用这个API，会先获取用户授权。如果用户取消授权，那么再调这个Api，也不会再出现授权页面，也就不能再获取用户位置了，这就需要使用其他的Api辅助打开授权页面了。所以获取用户位置就需要完整的授权、获取位置的流程及异常流处理了。

业务流程图：

关键技术点：

页面加载默认调用 wx.getLocation ,然后如果获取失败则调用 wx.getSetting ，如果未授权，则调用 wx.openSetting 打开授权设置界面，如果授权界面设置允许授权，则返回页面再次调用 wx.getLocation，主要的流程就是这个了。

示例代码：

 const app = getApp()

 Page({
   data: {
     hiddenReAuthorizePop:true,//隐藏重新授权确认弹窗
     latitude: "", //维度，浮点数
     longitude: "", //经度，浮点数
     content:"本活动需要获取位置才可以参加"
   },
   onLoad: function() {
     //1. 页面加载的时候获取定位
     this.getLocation()
   },
   /**
    * 1. 获取用户定位
    */
   getLocation: function() {
     var self = this;
     wx.getLocation({
       type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的坐标，可传入'gcj02'
       altitude: true, //传入 true 会返回高度信息，由于获取高度需要较高精确度，会减慢接口返回速度
       success: function(res) {
         var latitude = res.latitude; // 纬度，浮点数
         var longitude = res.longitude; // 经度，浮点数
         self.setData({
           latitude: res.latitude,
           longitude: res.longitude
         })
       },
       fail: function(res) {
         //未授权就弹出弹窗提示用户重新授权
         self.reAuthorize();
       }
     });
   },
   /**
    * 1.2 重新授权按钮点击事件
    * click event
    */
   openLocationSetting: function() {
     var self = this
     //先获取用户的当前设置，返回值中只会出现小程序已经向用户请求过的权限
     wx.getSetting({
       success: function(res) {
         if (res.authSetting && !res.authSetting["scope.userLocation"]) {
           //未授权则打开授权设置界面
           wx.openSetting({
             success: function(res) {
               if (res.authSetting && res.authSetting["scope.userLocation"]) {
                 //允许授权,则自动获取定位，并关闭二确弹窗，否则返回首页不处理
                 self.getLocation();
                 self.setData({
                   hiddenReAuthorizePop:true
                 })
                 wx.showToast({
                   title: '您已授权获取位置信息',
                   icon: 'none'
                 })
               }else{
                 //未授权就弹出弹窗提示用户重新授权
                 self.reAuthorize();
               }
             }
           })
         } else {
           //授权则重新获取位置新（授权设置界面返回首页，首页授权二确弹窗未关闭）
           self.getLocation();
         }
       }
     })
   },
   /**
    * 重新授权
    */
   reAuthorize:function(){
     var self=this
     self.setData({ hiddenReAuthorizePop:false})
   }
 })

代码片段地址：https://developers.weixin.qq.com/s/uRMylxmO7e3Q

原创专业博客，转载请注明来源地址：https://www.cnblogs.com/xyyt/p/9871898.html