昨天接到用户通知说在点击“看场地”时无法获取地理位置信息。

在接到通知时,首先想到的是排查机型问题。由于客户多为IOS用户,所以最先看的是在安卓是有没有此问题的发生,调查结果为安卓没有任何问题。再排查IOS的版本问题,结果发现无法获取地理位置的为IOS10版本,而IOS9上同样无此现象的产生。

所以基本定位到是IOS 10版本可能对我们现在的代码没法兼容,没办法小胳膊弄不过大腿,所以我们再定位现在的代码是通过什么样的方式去获取地理位置的。

结果如下:

基本可以确定IOS 10可能对H5获取地理位置的API做了限制或者有了修改,具体什么修改还需要继续排查。

在网上google了一下,原来这个问题在IOS10推出就已存在,现在已经到了10.3+了我们才暴露出来,蜜汁尴尬。。

具体的原因也说的比较明白:

  在IOS 10中,苹果对webkit定位权限进行了修改,所有定位请求的页面必须是https协议的。如果是非https网页,在http协议下通过html5原生定位接口会返回错误,
也就是无法正常定位到用户的具体位置,而已经支持https的网站则不会受影响。

基本网上有两种解决方案:

1、将网站的http设置为Https。

2、通过第三方解决,即通过调用百度地图或者腾讯地图来获取地理位置

文章链接地址 http://blog.csdn.net/for12/article/details/52803787

作者也是在使用第三方解决,但是我在使用百度API去获取地理位置的时候发现和真实的经纬度又有所偏差,原来百度地图对地理位置又进行了二次加密,又是一个坑,果断放弃。

而第一个方案,升级网站为https是个长期规划的过程(鬼才知道有多少个坑在里面),所以就需要找一个比较能短时间解决问题的方案。

最后终于在犄角旮旯找到了基本的解决方案:采用iframe可以绕过IOS的这一限制(但是没法绕过谷歌浏览器的限制)


var options = {
enableHighAccuracy: true,
maximumAge: 30000,
timeout: 12000
} window.locationCallback = function(err, position){
if (err) {
showError(err);
return ;
} showPosition(position);
} var str = '<iframe src="javascript:(function(){ '
+'window.navigator.geolocation.getCurrentPosition('
+'function(position){parent && parent.locationCallback && parent.locationCallback(null,position);}, '
+'function(err){parent && parent.locationCallback && parent.locationCallback(err);}, '
+'{enableHighAccuracy : '+ options.enableHighAccuracy +', maximumAge : '+ options.maximumAge +', timeout :'+ options.timeout +'})'
+';})()" style="display:none;"></iframe>';
$(str).appendTo('body') window.showPosition = function(position) {
// TODO
}
window.showError = function(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
alert('用户不允许地理定位!');
break;
case error.POSITION_UNAVAILABLE:
alert('无法获取当前位置!');
break;
case error.TIMEOUT:
alert('操作超时!');
break;
case error.UNKNOWN_ERROR:
alert('未知错误!');
break;
}
}

不得不说谷歌和苹果真有着挺进新标准的勇气和果断,或许这才是互联网领头羊的气势吧。

解决window.navigator.geolocation.getCurrentPosition在IOS10系统中无法进行地理定位问题的更多相关文章

  1. 完美解决window.navigator.geolocation.getCurrentPosition,在IOS10系统中无法定位问题

    目前由于许多用户都将电话升级到了iOS系统,苹果的iOS 10已经正式对外推送,相信很多用户已经更新到了最新的系统.然而,如果web站没有及时支持https协议的话,当很多用户在iOS 10下访问很多 ...

  2. 用navigator.geolocation.getCurrentPosition在IOS10以上的系统无法定位

    昨天老板告诉我代码有Bug(定位失败),于是各种测试最终发现IOS10以上版本手机不能成功(穷,买不起iphone,测试不完全),先贴失败代码: var city =""; nav ...

  3. IOS10 window.navigator.geolocation.getCurrentPosition 无法定位问题

    在iOS 10中,苹果对webkit定位权限进行了修改,所有定位请求的页面必须是https协议的. 如果是非https网页,在http协议下通过HTML5原生定位接口会返回错误,也就是无法正常定位到用 ...

  4. 在IOS10系统中无法定位问题

    果是非https网页,在http协议下通过html5原生定位接口会返回错误,也就是无法正常定位到用户的具体位置,而已经支持https的网站则不会受影响. 目前提供的解决方案: 1.将网站的http设置 ...

  5. navigator.geolocation在IOS10系统中无法定位问题

    在使用地图需要定位的朋友都可能遇到这个问题,参考的文章说的是用百度地图,我用的是腾讯地图,但是其中的原理差不多.所以谢谢这些提供资源的大神们. if (navigator.geolocation) { ...

  6. HTML5浏览器定位navigator.geolocation.getCurrentPosition

    <!DOCTYPE html> <html> <body> <p id="demo">点击这个按钮,获得您的坐标:</p> ...

  7. 【H5】 经纬度位置获取navigator.geolocation.getCurrentPosition

    navigator.geolocation.getCurrentPosition(function(){})经度 : coords.longitude 纬度 : coords.latitude 准确度 ...

  8. navigator.geolocation.getCurrentPosition

    navigator.geolocation.getCurrentPosition Geolocation API Specification 2nd Edition W3C Recommendatio ...

  9. js定位navigator.geolocation

    一.简介 html5为window.navigator提供了geolocation属性,用于获取基于浏览器的当前用户地理位置. window.navigator.geolocation提供了3个方法分 ...

随机推荐

  1. selenide小白教程

    目的: 趁着清明假期临近把手头工作整理了一下,前段时间老大给了一个selenide研究的任务,虽然对selenium的应用比较熟悉,但是以前一直没怎么研究过其他衍生的技术,在研究过程中发现国内好的帖子 ...

  2. C++ Primer 5 CH7 类

    7.1 定义抽象数据类型 定义和声明成员函数的方式与普通函数差不多,成员函数的声明必须在类的内部,定义可以在类的内部或外部.作为接口组成部分的非成员函数的声明和定义都在类的外部. 定义在类内部的函数是 ...

  3. adobe edge animate 和 adobe animate cc 有啥区别?

    经常有人问这两款软件的区别,每次都要打字好烦,特此总结发帖如下: 一.首先各自软件介绍 ①adobe edge animate 是adobe公司早期推出的一款网页互动工具.通过HTML+CSS+Jav ...

  4. 老李分享:接电话扩展之uiautomator 2

    主要的类就是上面的PhoneReceiver广播接收者.来电的时候,我们记录下电话号码,等该来电挂断以后,立即回拨给对方.配置文件如下: <?xml version="1.0" ...

  5. 老李推荐:第6章8节《MonkeyRunner源码剖析》Monkey原理分析-事件源-事件源概览-小结

    老李推荐:第6章8节<MonkeyRunner源码剖析>Monkey原理分析-事件源-事件源概览-小结   本章我们重点围绕处理网络过来的命令的MonkeySourceNetwork这个事 ...

  6. 纯JS写最简单的图片轮播

    非常简单的一个大图轮播,通过将控制显示位置来进行轮播效果,写来给正在学习的新手朋友们参考交流. 先看效果:(实际效果没有这么快) 先看布局: <div id="display" ...

  7. JavaScript定时器分析

    一.事件循环 JavaScript是单线程,同一个时间只能做一件事情,所以执行任务需要排队.如果前一个耗时很长,那么下一个只能等待. 1)两种任务 为了更好的处理任务,JavaScript语言的设计者 ...

  8. Historical节点

    Historical节点 Historical 节点的作用是,load 历史数据提供查询. 运行类 io.druid.cli.Main server historical 装载和保存Segments ...

  9. JQuery处理DOM元素-属性操作

    JQuery处理DOM元素-属性操作 //操作元素的属性: $('*').each(function(n){ this.id = this.tagName + n; }) //获取属性值: $('') ...

  10. CPP--借助神器VS理解内存存储

    之前也有想了解这些,第一个不是学底层的不知道从何理解,第二个上网搜概念,大牛们三言两语就结束了,举得例子也比较复杂,对于非C方向的可能有点吃力,所以一直没理解. 今天偶然发现原来还要内存窗口之说,就慢 ...