html5使用js确定用户坐标位置
最近在微信平台开发时,涉及到的问题。如何获取用户当前坐标位置。
微信用户坐标定位的实现方案
1、使用微信的共享位置,获取用户坐标。缺点:可能会需要用户手动点击获取位置,体验不好。优点:坐标比较精准 且用户可以手动调整位置;
2、使用html5的获取地理位置方案。缺点:坐标不太精准,且部分手机的微信浏览器不支持html5。优点:不需用户太多参与。
3、使用百度地图的ip定位。缺点:坐标差距太大,建议直接舍弃。
我这里采用了第二种方案,但是在获取过程种发现有时候判断不准确。
原来代码
var isSupportGeolLoc = navigator.geolocation ? true : false; if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); }else{ alert("你的手机不支持定位,现将转到自助设备列表页面!"); return; }
在我的理解中,手机要么支持该服务,要么不支持。但是在实际的测试过程中发现,部分手机并不能正确提示,也不能有效获取对应的坐标。于是在网上搜索原因。原因如下
部分国行Android手机“阉割”了谷歌GMS服务包,导致HTML5的geolocation无法使用wifi和基站定位服务导致。
这个时候就会发现,假如你的手机支持浏览器定位但是你没有打开相关服务或者该服务对应的组件有问题,上面的代码均不能正确的显示当前坐标。重新修改代码为
$(window).load(function() { //是否支持定位的参数 var isSupportGeolLoc = navigator.geolocation ? true : false; if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition,handleLocationError, {maximumAge:6000,timeout:5000, enableHighAccuracy:true} ); //navigator.geolocation.getCurrentPosition(showPosition); }else{ alert("你的手机不支持定位,现将转到自助设备列表页面!"); return; } }); function handleLocationError(error){ switch(error.code){ case error.TIMEOUT: alert("获取位置信息超时!"); break; case error.PERMISSION_DENIED: alert("您设置了阻止该页面获取位置信息!"); break; case error.POSITION_UNAVAILABLE: alert("浏览器无法确定您的位置!"); break; default: alert("获取位置信息出错!"); break; } }
此时即可正常处理不同的业务了。
相关推荐
wusiye 2020-10-23
表格的现在还是较为常用的一种标签,但不是用来布局,常见处理、显示表格式数据。在HTML网页中,要想创建表格,就需要使用表格相关的标签。<table> <tr> <td>单元格内的文字</td> ...
gufudhn 2020-08-09
nercon 2020-08-01
swiftwwj 2020-07-21
nercon 2020-07-16
饮马天涯 2020-07-05
Lophole 2020-06-28
gufudhn 2020-06-12
csstpeixun 2020-06-11
huzijia 2020-06-09
WebVincent 2020-06-06
行吟阁 2020-05-30
qsdnet我想学编程 2020-05-26
gufudhn 2020-05-25
qsdnet我想学编程 2020-05-19
suixinsuoyu 2020-05-15
HSdiana 2020-05-15
PioneerFan 2020-05-15