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

Question

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

当前位置无法确定。

我遵循了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

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);
                }
            }

Answer 2

我的想法如下：

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);
   }
});