navigator.geolocation从第二次执行返回错误 - IE

Question

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

The current position could not be determined.

我已按照this question's answers没有成功给出的建议，我怎么能得到这个工作？

在这里您可以找到一个working fiddle以快速查看错误。

//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一次。用户必须授予它多次运行的异常。

However I don't know (and can't really find any documentation) if this behaviour is by design or a bug. The solution below is a work-around.

使用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测试，边缘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); 
       } 
      }