夜雨聆风
uniApp获取用户详细的地理位置信息
简单描述一下uniapp获取用户详细地理位置信息
描述权限原因
调用微信小程序的定位接口必须描述申请权限的原因,HBX创建的项目直接在HBX中点击manifest.json就可以可视化配置，如果是Cli创建的项目需要手动配置manifest.json文件。这个描述会在微信小程序授权位置信息的弹窗中显示
初始化
●●●js const QQMapWX = require('../../static/js/qqmap-wx-jssdk.min.js');const qqMapSdk = new QQMapWX({ key: 'JQJBZ-***********-I7QNQ-NXFAK'//自己的key秘钥 http://lbs.qq.com/console/mykey.html 在这个网址申请});
查看授权情况
●●●js const getAuthorize = () => { uni.getSetting({ success: (res) => { console.log('res', res)if (!res.authSetting['scope.userLocation']) { uni.authorize({ scope: 'scope.userLocation', success: () => {//允许授权getUserLocation() }, fail: (failRes) => { console.log('failRes', failRes)//拒绝授权 uni.showModal({ title: '温馨提示', content: '检测到您关闭授权位置信息，请在设置中打开后重试', success: function (modalRes) {if (modalRes.confirm) { uni.openSetting({// 打开设置页success(settingRes) {if (settingRes.authSetting['scope.userLocation']) {//允许授权getUserLocation() } } }); } elseif (modalRes.cancel) { console.log('用户点击取消'); } } }) } }) } else {//允许授权过了getUserLocation() } } })}
逆地理 （方式一）
获取到经纬度以后 还有借助第三方平台转化为具体的地理位置（逆地理），因为微信小程序中map组件默认使用的是腾讯地图，所以这边使用腾讯地图API进行解析。
正式步骤为：
官方说明
【https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview】
●在[腾讯地图平台]【https://lbs.qq.com/】申请自己的秘钥
●下载微信小程序JavaScriptSDK引入自己的文件
●初始化SDK(这一步在上面的初始化中已经提现)
●●●js const getUserLocation = () => { uni.getLocation({ type: 'gcj02', success: (res) => {const { latitude, longitude } = res qqMapSdk.reverseGeocoder({ location: { latitude, longitude }, success: (res) => { console.log('loginAddress', res) }, fail: (failRes) => { }, complete: (completeRes) => { } }); } })}
逆地理 （方式二 推荐）
使用腾讯地图的服务端的接口就可以实现
[官方文档]
【https://lbs.qq.com/service/webService/webServiceGuide/webServiceOverview】