
前言在微信小程序开发中获取用户当前的地理位置是一个常见需求。无论是外卖配送、打车服务、旅游导航还是社交签到都离不开地理位置功能。很多新手开发者不清楚wx.getLocation需要配置哪些权限、坐标体系如何选择、用户拒绝授权后怎么处理以及如何把经纬度转换成详细地址。本文将从零开始手把手教你完成微信小程序获取经纬度的完整实现包括配置权限、调用 API、用户授权处理、逆地址解析以及避坑指南。一、准备工作1.1 申请接口权限从 2022 年 7 月 14 日后发布的小程序开始使用wx.getLocation接口需要在app.json中进行声明否则将无法正常使用。同时小程序管理后台需要开通对应的接口权限。具体步骤登录微信小程序管理后台进入「开发」→「开发管理」→「接口设置」找到「获取当前的地理位置、速度」接口点击「开通」1.2 app.json 配置在小程序的app.json文件中需要添加以下配置json{ pages: [pages/index/index], permission: { scope.userLocation: { desc: 你的位置信息将用于小程序位置接口的效果展示 } }, requiredPrivateInfos: [getLocation] }permission.scope.userLocation.desc用户授权时弹出的说明文案必须填写不能为空requiredPrivateInfos声明小程序需要使用的地理位置相关接口注意如果只在requiredPrivateInfos中填写了getLocation那么在调用wx.getLocation时会自动触发弹窗向用户申请scope.userLocation授权。二、核心 API 详解微信小程序提供了三个核心的定位相关 API分别是wx.getLocation、wx.openLocation和wx.chooseLocation。2.1 wx.getLocation获取当前地理位置wx.getLocation用于获取用户当前的地理位置返回经纬度、速度和精度等信息。基础用法javascriptwx.getLocation({ type: gcj02, success: (res) { console.log(定位成功, res); console.log(纬度, res.latitude); console.log(经度, res.longitude); console.log(精度, res.accuracy); }, fail: (err) { console.error(定位失败, err); } });参数说明参数类型必填说明typestring否坐标系类型默认 wgs84可选 gcj02isHighAccuracyboolean否是否开启高精度定位highAccuracyExpireTimenumber否高精度定位超时时间毫秒successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数返回参数说明字段类型说明latitudenumber纬度范围 -90~90负数表示南纬longitudenumber经度范围 -180~180负数表示西经speednumber速度单位 m/saccuracynumber位置的精确度数值越小越精确2.2 type 参数详解wgs84 vs gcj02wx.getLocation的type参数有两个可选值wgs84默认返回 GPS 原始坐标适用于国际标准的地图服务gcj02返回国测局坐标系火星坐标适用于高德地图、腾讯地图等国内地图服务如果后续要将定位显示在微信内置地图中建议使用gcj02因为wx.openLocation接收的经纬度参数也是 gcj02 坐标系。2.3 wx.openLocation打开内置地图获取到经纬度后可以使用wx.openLocation调用微信内置地图或跳转手机系统地图查看位置。这是最终触发用户设备导航的核心方法。javascriptwx.getLocation({ type: gcj02, // 返回可以直接用于 wx.openLocation 的经纬度 success(res) { const latitude res.latitude; const longitude res.longitude; wx.openLocation({ latitude: latitude, longitude: longitude, scale: 18, // 缩放比例范围5~18 name: 目标位置, // 位置名 address: 详细地址说明 // 地址详细说明 }); } });2.4 wx.chooseLocation让用户选择位置如果需要用户手动选择一个位置比如收货地址可以使用wx.chooseLocation打开微信内置地图让用户选择位置点返回选中的坐标和名称。javascriptwx.chooseLocation({ success: (res) { console.log(位置名称, res.name); console.log(详细地址, res.address); console.log(纬度, res.latitude); console.log(经度, res.longitude); }, fail: (err) { console.error(选择位置失败, err); } });三、完整实战示例3.1 WXML 页面html!-- pages/index/index.wxml -- view classcontainer button bindtapgetLocation typeprimary获取当前位置/button button bindtapchooseLocation typedefault选择位置/button view classinfo wx:if{{latitude longitude}} text纬度{{latitude}}/text text经度{{longitude}}/text text位置名称{{addressName || 未选择}}/text button bindtapopenMap sizemini在地图中查看/button /view /view3.2 JavaScript 逻辑javascript// pages/index/index.js Page({ data: { latitude: 0, longitude: 0, addressName: }, onLoad(options) { // 页面加载时获取定位 this.getLocation(); }, // 获取用户当前位置 getLocation() { const that this; wx.getLocation({ type: gcj02, // 使用火星坐标系便于后续地图显示 isHighAccuracy: true, // 开启高精度定位 highAccuracyExpireTime: 4000, // 高精度超时时间毫秒 success: (res) { console.log(定位成功, res); that.setData({ latitude: res.latitude, longitude: res.longitude }); wx.showToast({ title: 定位成功, icon: success }); }, fail: (err) { console.error(定位失败, err); // 处理用户拒绝授权等情况 this.handleAuthFail(); } }); }, // 用户选择位置 chooseLocation() { const that this; wx.chooseLocation({ success: (res) { console.log(选择的位置, res); that.setData({ latitude: res.latitude, longitude: res.longitude, addressName: res.name }); }, fail: (err) { console.error(选择失败, err); } }); }, // 在地图中查看当前位置 openMap() { wx.openLocation({ latitude: this.data.latitude, longitude: this.data.longitude, scale: 18, name: this.data.addressName || 当前位置 }); }, // 处理授权失败 handleAuthFail() { wx.showModal({ title: 提示, content: 该功能需要获取您的位置信息请在设置中开启, confirmText: 去设置, success: (res) { if (res.confirm) { wx.openSetting({ success: (settingRes) { if (settingRes.authSetting[scope.userLocation]) { // 用户重新授权后重新获取位置 this.getLocation(); } } }); } } }); } });3.3 添加样式可选css/* pages/index/index.wxss */ .container { padding: 20rpx; } button { margin-bottom: 20rpx; } .info { margin-top: 40rpx; padding: 20rpx; background: #f5f5f5; border-radius: 10rpx; }四、用户授权处理4.1 授权流程首次调用wx.getLocation时会自动弹出授权弹窗询问用户。但如果用户拒绝了授权再次调用wx.getLocation将不会弹出授权弹窗而是直接进入fail回调。4.2 检查授权状态并引导用户开启javascript// 检查授权状态 wx.getSetting({ success: (res) { if (res.authSetting[scope.userLocation]) { // 已授权直接获取位置 this.getLocation(); } else { // 未授权引导用户去设置页面开启 wx.showModal({ title: 需要授权, content: 请授权地理位置权限以便使用相关功能, confirmText: 去授权, success: (modalRes) { if (modalRes.confirm) { wx.openSetting({ success: (settingRes) { if (settingRes.authSetting[scope.userLocation]) { this.getLocation(); } } }); } } }); } } });4.3 兼容性处理如果用户始终拒绝授权建议提供一个手动输入位置或手动选择位置的兜底方案wx.chooseLocation不受wx.getLocation授权失败的影响因为它会拉起地图让用户主动选择位置五、逆地址解析经纬度转详细地址wx.getLocation只能获取到经纬度无法直接拿到省、市、街道等详细地址信息。如果需要将经纬度转换为具体地址需要借助第三方服务进行逆地址解析。以腾讯位置服务为例5.1 申请腾讯位置服务 Key访问腾讯位置服务官网lbs.qq.com注册账号进入控制台创建一个应用启用「WebServiceAPI」产品获取 KeyAPI 密钥5.2 调用逆地址解析 APIjavascriptwx.getLocation({ type: gcj02, success: (res) { const url https://apis.map.qq.com/ws/geocoder/v1/; const params { location: ${res.latitude},${res.longitude}, key: 你的腾讯地图Key, get_poi: 1 // 是否返回周边POI信息 }; wx.request({ url: url, data: params, success: (response) { if (response.data.status 0) { console.log(详细地址, response.data.result.address); console.log(省市区, response.data.result.ad_info); } else { console.error(逆地址解析失败, response.data); } }, fail: (err) { console.error(请求失败, err); } }); } });5.3 返回数据结构示例json{ status: 0, message: OK, result: { address: 上海市浦东新区XX路XX号, location: { lat: 31.2304, lng: 121.4737 }, ad_info: { nation: 中国, province: 上海市, city: 上海市, district: 浦东新区 } } }六、常见问题与避坑指南问题 1wx.getLocation 调用后无反应或报错原因未在app.json中配置requiredPrivateInfos或管理后台未开通接口权限。解决方案检查app.json中是否包含requiredPrivateInfos: [getLocation]在微信小程序管理后台检查「获取当前的地理位置」接口是否已开通问题 2定位不准确或偏差较大原因type参数设置不当或坐标体系不匹配。解决方案使用type: gcj02配合腾讯地图或高德地图使用如果使用的是wgs84坐标需要先转换为gcj02坐标再显示在地图上开启高精度定位isHighAccuracy: true问题 3用户拒绝授权后无法再次弹出授权原因用户拒绝后微信不会再次自动弹出授权弹窗。解决方案调用wx.openSetting()引导用户去小程序设置页面手动开启授权。问题 4申请 wx.getLocation 接口权限被驳回原因微信对wx.getLocation接口的审核非常严格需要符合「线下门店导航服务」等特定场景。解决方案如果只是需要获取大致位置或城市级别定位可以考虑使用wx.getFuzzyLocation、wx.chooseLocation、wx.choosePoi或wx.chooseAddress作为替代方案改进申请理由充分说明业务场景与权限需求的必要性问题 5高频调用导致耗电和性能问题解决方案如需持续获取位置可以使用持续定位接口wx.onLocationChange并根据移动速度动态调整采样频率。七、总结本文详细介绍了微信小程序获取经纬度的完整流程包括权限配置app.json中声明requiredPrivateInfos和管理后台接口开通核心 APIwx.getLocation获取经纬度、wx.openLocation打开地图、wx.chooseLocation选择位置坐标体系wgs84 和 gcj02 的区别与选择用户授权授权检查、拒绝后引导开启的完整方案逆地址解析借助腾讯位置服务将经纬度转换为详细地址常见问题覆盖了开发中高频踩坑场景及解决方案微信小程序demo: 佳心查经纬度海拔