navigator.geolocation在IE上第二次执行时返回错误

Question

第一次执行navigator.geolocation.getCurrentPosition(success, error, options);时，我能够获取用户的位置。 但是，从第二次执行开始，该函数将返回错误：

目前的位置无法确定。

我遵循了这个问题答案中给出的建议，但没有成功，我怎样才能让它工作？

在这里，您可以找到一个工作小提琴来快速查看错误。

//Pass this options to the getCurrentPosition
var options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
//function to execute if the current position was succesfully retrieved
function success(pos) {
console.log(pos);
var crd = {lat: pos.coords.latitude, lng : pos.coords.longitude };
var myPre = document.querySelector('pre');
myPre.textContent = JSON.stringify(crd);
myPre.style.color = someColor(); // use a diferent color just to see it's a new execution of the code
};
//execute this on error
function error(err) {
var myPre = document.querySelector('pre');
myPre.textContent = err;
myPre.style.color = someColor(); // use a diferent color
};
//attach function to button
var myButton = document.querySelector('button');
myButton.addEventListener('click', function(){
navigator.geolocation.getCurrentPosition(success, error, options);
});

Answer 1

我的想法如下：

IE 用户仅允许网站(脚本((默认设置(运行一次getCurrentLocation。用户必须授予异常才能多次运行。

但是我不知道(并且找不到任何文档(这种行为是设计使然还是错误。下面的解决方案是一个变通方法。

在初始成功绕过此错误后，请改用watchposition。请参阅更新的小提琴：https://jsfiddle.net/b2rnr7tw/6/

在这个小提琴中，我设置了一个watchPosition，一旦它更新，它就会显示新位置。之后它被取消(否则它会不断更新(。

//Pass this options to the getCurrentPosition
var options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
var watch = null;
var watchId = null;
//function to execute if the current position was succesfully retrieved
function success(pos) {
var crd = {lat: pos.coords.latitude, lng : pos.coords.longitude };
var myPre = document.querySelector('pre');
myPre.textContent = JSON.stringify(crd);
myPre.style.color = someColor(); // use a diferent color
watch.clearWatch(watchId); //after success clear the watchId.
};
//execute this on error
function error(err) {
var myPre = document.querySelector('pre');
myPre.textContent = err;
myPre.style.color = someColor(); // use a diferent color
//keep running the watchPosition if on error, however you can use a counter to only try it a few times (recommended)
};
//attach function to button
var myButton = document.querySelector('button');
myButton.addEventListener('click', function(){
if (!watch)
{
watch = navigator.geolocation;
watch.getCurrentPosition(success, error, options);
}
else
{
watchId = watch.watchPosition(success, error, options);
}
});

Answer 2

Mouser的解决方案在IE11中对我有用，但是破坏了Edge，因此我们需要浏览器检测。这是我在IE11，Edge 14，FFx和Chrome中测试的解决方案(撰写本文时最新版本的FFx和Chrome(

var currentPositionHasBeenDisplayed = false;
if (navigator.geolocation) {
var options = {};
var isIE = document.documentMode; //IE 8+
// IE only allows one call per script to navigator.geolocation.getCurrentPosition, so we need a workaround
if (currentPositionHasBeenDisplayed == true && isIE) {
navigator.geolocation.watchPosition(
function (pos) {
var myLatLng = new google.maps.LatLng(parseFloat(pos.coords.latitude), parseFloat(pos.coords.longitude));
map.setCenter(myLatLng);
},
function (error) {  },
options);
}
else {
navigator.geolocation.getCurrentPosition(
function (pos) {
var myLatLng = new google.maps.LatLng(parseFloat(pos.coords.latitude), parseFloat(pos.coords.longitude));
map.setCenter(myLatLng);
currentPositionHasBeenDisplayed = true;
}, 
function (error) { return false; },
options);
}
}