【微信小程序】获取用户地理位置及遇到的坑

喜欢ヅ旅行 2023-06-28 09:57 81阅读 0赞

最近写小程序用到，需要获取用户的地理位置才能根据位置展示相应的数据。也踩了一些坑如下：  
先来看看api文档  
**wx.getLocation(Object object)**  
（调用前需要用户授权，用户点击确定才能拿得到数据）获取当前的地理位置、速度。当用户离开小程序后，此接口无法调用。开启高精度定位，接口耗时会增加，可指定 highAccuracyExpireTime 作为超时时间。  
他的一些参数就不说了(大家可以去看看文档)直接上代码：

onLoad() { 
        this.getLocation() //页面加载的时候获取用户位置
      },
    
    // 获取地理位置
      getLocation() { 
        wx.getLocation({ 
          success(res) { 
            console.log(res)
          },
          fail() { 
             wx.showToast({  title: '定位失败，请重试', icon: 'none' })
          }
        })
      },

当用户进入到这个页面的话弹窗会弹出来提示  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ_size_16_color_FFFFFF_t_70]  
点击确定就能拿到用户的位置了输出如下  
![在这里插入图片描述][20200108180300818.png]  
很简单的对吧 但是有坑的这个弹窗就是不出来，你也调用了它就是不出来，找了一圈坑如下  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ_size_16_color_FFFFFF_t_70 1]  
这个是在wx.getLocation(Object object)那页看不到的，我是在开放社区里面找到了！！！所以说还要再app.json里面配一下 上代码：

"permission": { 
        "scope.userLocation": { 
          "desc": "你的位置信息将用于小程序附近美食的数据的展示"
        }
      },

小贴士：**里面这行字在30以内。。。。。。。**

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ_size_16_color_FFFFFF_t_70 2]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200108180020476.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ==,size_16,color_FFFFFF,t_70
[20200108180300818.png]: https://img-blog.csdnimg.cn/20200108180300818.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200108180639336.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20200108182312112.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1pfa2Vuc2hvdQ==,size_16,color_FFFFFF,t_70