昨天接到用戶通知說在點擊“看場地”時無法獲取地理位置信息。
在接到通知時,首先想到的是排查機型問題。由於客戶多為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;
}
}
不得不說谷歌和蘋果真有着挺進新標准的勇氣和果斷,或許這才是互聯網領頭羊的氣勢吧。