uniapp h5 (变相)解决getLocation:fail Geolocation permission denied.Get ipLocation failed.

问题起源:需要做一个打卡的功能,但是打卡需要传递给后端经纬度,在使用uniapp自带的uni.getLocation中api回调不触发,成功失败都不会走,所以没有办法,换个思路

1、使用高德ip定位,上代码

在高德的应用中添加一个web服务的key,如果不知道怎么去添加的话可以看我另外一篇文章,有提到过如何在高德创建应用能申请key

传送门:uniapp使用高德地图实现选择地址 h5版本-CSDN博客

let _key = '申请的key'; //高德API key类型:web服务
uni.request({
    method: 'GET',
	url: 'https://restapi.amap.com/v3/ip',
	data: {
		key: _key,
		output: 'JSON'
	},
	success: async (res) => {
		console.log('经纬度', res);
        
		let rectangle = res.data.rectangle
        //由于rectangle返回的是左下右上对标对,所以需要拆分,将两个经纬度分开
		let pointsStr = rectangle.split(';');
		// 创建一个新的数组来保存最终的经纬度
		let coordinates = [];
		// 对每个点的字符串再按照逗号进行分割,并将结果转换为浮点数
		pointsStr.forEach(point => {
		    let [lng, lat] = point.split(',')
		    // 将分割后的经度和纬度添加到数组中
		    coordinates.push([lng, lat]);
	    });
		console.log('rectangle数组', coordinates);
	},
	fail: r => {
		console.log(r);
	}
});

此时你就能拿到当前城市的经纬度了

缺点:拿不到精确的经纬度,只能拿到城市两个边缘经纬度

优点:不花钱

2、使用百度地图

直接申请百度地图的应用使用ip定位

百度地图创建应用传送门:登录百度账号

创建应用是一定要选【服务端】,然后需要配置白名单,白名单需要跟后端联调,因为百度的接口是会跨域的,所以得后端逆处理一下,简而言之就是后端请求百度,前端请求后端,至于后端怎么处理就要问后端了,我不会后端...如果后端不知道怎么处理 可以问问这位大佬(他是后端)Michael_yo-CSDN博客

然后上代码获取经纬度

 百度ip定位文档传送门:普通IP定位 | 百度地图API SDK

let _key = '填你申请的百度AK'; //百度地图的【AK】
uni.request({
		method: 'GET',
           //https://api.map.baidu.com/location/ip这个百度的ip定位接口
		url: '这里填后端处理后给回你的接口',
		data: {
				coor:'bd09ll',
				ak: _key,
		},
		success: async (res) => {
		    console.log('经纬度', res);
		    //用户所在的地理位置信息
		},
		fail: r => {
			console.log(r);
		}
});

这里是百度定位回给我的数据结构 ,可做参考

{
    "address": "CN|广东省|惠州市|None|None|100|100",
    "content": {
        "address": "广东省惠州市",
        "address_detail": {
            "adcode": "441300",
            "city": "惠州市",
            "city_code": 301,
            "district": "",
            "province": "广东省",
            "street": "",
            "street_number": ""
        },
        "point": {
            "x": "114.42355802",
            "y": "23.11635885"
        }
    },
    "status": 0
}

至此,准确的经纬度就能拿到了,

温馨提示:百度地图他是有配额的,如果你超出配额的话就需要购买,不过没有高德那么贵 5w一年...我真的会谢... 虽然百度也收费,但是他30块钱有1w的配额,我觉得性价比比高德高很多,不过我是个人认证的,所以如果是企业认证的话价格我不知道是否会有浮动,具体还是自己去看平台吧。(附配额截图参考)

配额明细传送门:登录百度账号

点击链接查看,因为我是用ip定位,他是一天5000的配额,对于我的项目我感觉差不多够用(相当于免费使用了),但是你用户量庞大的还是需要购买滴。

如果对你有帮助,记得点赞收藏一波不迷路,解散!!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值