uniapp h5获取用户地理位置信息(高德地图)

 使用uni.getLocation()先获取到当前位置信息的经纬度

H5端测试可以使用http,上线打包需要设置为https模式

谷歌浏览器可能会获取不到任何信息,因为谷歌浏览器位置信息是连接谷歌服务器获取的,国内用户可能获取位置信息失败

getCurrentlocation(){
    let that = this
	uni.getLocation({
	type: 'wgs84',
	isHighAccuracy: true,//开启高精度定位
	success(res) {
	console.log('当前位置的经度:' + res.longitude);
	console.log('当前位置的纬度:' + res.latitude);
	}
	})
}

使用高德开发平台注册一个key

高德开发平台:高德开放平台 | 高德地图API (amap.com)

 拿到key在manifest.json里进行配置

 配置完成后使用高德的逆地理编码对上面请求拿到的经纬度进行解析

	turnAdrr(longitude, latitude) {
				let that = this
				let _key = '高德里你注册的key'; //高德API key类型:web服务
				uni.request({
					method: 'GET',
					url: 'https://restapi.amap.com/v3/geocode/regeo?parameters',
					data: {
						key: _key,
						location: `${longitude},${latitude}`,
						output: 'JSON',
					},
					success: (res) => {
						console.log(res.data.regeocode.formatted_address);
				           //用户所在的地理位置信息
					},
					fail: r => {
						console.log(r);
					}
				});
			}

App的话可以直接调用uni.getLocation()拿到用户的所在位置,不需要进行解析,可以直接拿到

uni.getLocation({
    type: 'gcj02', //app直接获取地理位置信息要使用gcj02
    geocode:true , //必须要将geocode配置为true
	isHighAccuracy: true,
	success(res) {
		console.log(res.address)
	},
    fail(err){
    console.log(err)
}
})

  • 5
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 14
    评论
评论 14
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值