微信小程序 - 获取用户当前位置信息（用于定位地址及获取地址等需求）

前言

有两种获取位置的方式，一种是 直接返回经纬度等信息（必须代码处理后才能显示到界面上），另一种是 "界面选择式" 由用户打开地图选择位置。

最近有添加用户收货地址需求（外卖项目），需要获取用户当前位置。

第一步

说白了，就是微信需要让用户确定是否允许你获取它的位置，如果你不授权，将弹框提示。

首先，你必须进行 授权 ，无论是哪种获取用户地址的方式。

---

一、配置 app.json 文件，加入以下代码：

"permission": {
     
  "scope.userLocation": {
     
    "desc": "这里填写描述信息(如：美团请求获取您的位置信息)"
  }
}

不知道加在哪里的话，请看如下配置示例：

{
     
  "pages": [
    "pages/index/homePage/homePage",
    "pages/menu/homePage/homePage",
  ],
  
  "permission": {
     
    "scope.userLocation": {
     
      "desc": "请求获取您的位置信息"
    }
  },
  
  "window": {
     
    "navigationBarBackgroundColor": "#ffffff",
  },
  
  "sitemapLocation": "sitemap.json"
}

这样，就完成了授权配置工作。

第二步

首先你要确保你已经做了授权配置（第一步），否则会出现未授权弹框提示。

先来看一下 API ，后面我们代码来实现。

1. wx.getLocation：获取当前的地理位置、速度。官方文档介绍
2. wx.chooseLocation：打开地图选择位置。官方文档介绍
   

代码实现：打开地图选择位置

推荐这种方式，由用户选择并确定，开发者也容易获取到当前位置信息。

我们来实现一下 wx.chooseLocation 由用户选择或搜索地址。

/*
* 很简单，直接在按钮中触发函数调用api即可
* 返回的res就包含了用户所选择的当前位置信息
* [api其他配置项请参照文档根据自身需求配置]
*/
wx.chooseLocation({
     
 success:function(res)
 {
     
    console.log(res)//包含所有当前位置信息
 }
})

打印结果：

实现：返回位置经纬度

这种方式更适合与 map 地图组件配合，用于动态刷新地图位置，但不适合获取当前位置信息。

我们来实现一下 wx.getLocation 方式获取经纬度等信息，但你需要将经纬度转为真实地址才能获取使用（如果你是与 map 地图组件配合那么不需要转换）。

wx.getLocation({
     
  type: 'wgs84',
  success (res) {
     
    // 返回数据
    console.log(res)
  }
})

打印结果（可以看到已经返回了经纬度，就证明已经定位到当前位置了）：

经纬度转真实地址比较繁琐，具体请参照：这篇文章，或参照相关资料。