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)
}
})

猜你喜欢

转载自blog.csdn.net/w_z_bin/article/details/129144955