如何在用戶允許訪問後使用瀏覽器GeoLocation

我在根據地理位置返回JSON的天氣API調用時遇到問題。瀏覽器詢問允許/拒絕訪問位置的問題，然後我希望API調用發生，最好在頁面加載時發生。我已將該呼叫置於按鈕點擊的後面，但它仍不會使用當地天氣更新該頁面。但是，如果我使用調試器遍歷代碼，則它可以正常工作。如何在用戶允許訪問後使用瀏覽器GeoLocation

的Javascript：

$(document).ready(function() { 
    var curLatitude = 'x'; 
    var curLongditude = 'y'; 
    var weatherApi = 'http://api.openweathermap.org/data/2.5/weather?q=London,GB&APPID=[insert-registered-api-key]'; 

// check for Geolocation support 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function(position) { 
      curLatitude = position.coords.latitude; 
      curLongditude = position.coords.longitude; 
       if (curLatitude !== 'x' && curLongditude !== 'y') { 
        weatherApi = 'http://api.openweathermap.org/data/2.5/weather?lat=' + curLatitude + 
             '&lon=' + curLongditude + '&APPID=[insert-registered-api-key]'; 

       }; 
      loadWeather(weatherApi); 
      }, function() {      
       console.log('FAILED'); 
       }); 
    } else { 
      console.log('No geoLoc'); 
      // no geo location support - just load London weather 
      loadWeather(weatherApi); 
    }; 


    $('#btnLocal').click(function() { 
     $(".message").html('clicked'); 
     loadWeather(weatherApi); 
    }); 

    function loadWeather(weatherApiUri) { 


     var current = ""; 
     var ok; 


     var ret = $.getJSON(weatherApiUri, function(jsonres) { 
      console.log("JSON Data: loaded"); 
      current = 'called api'; 
      console.log(current);    

      $(".message").html(current); 
     }).done(function() { 
      console.log("done"); 
      }).fail(function() { 
      console.log("error"); 
      }).always(function() { 
      console.log("complete"); 
      }); 




      var weatherReturned = {id:0 , main:"weather", description:"weather detail", icon:"code" }; 
      weatherReturned = ret.responseJSON.weather; 
      $(".message").html(ret.responseJSON.name + ', ' + weatherReturned[0].description); 

    }; 

});

JSON響應：

{"coord":{"lon":-0.13,"lat":51.51},"weather":[{"id":500,"main":"Rain","description":"light rain","icon" 
:"10d"}],"base":"cmc stations","main":{"temp":290.673,"pressure":1009.48,"humidity":83,"temp_min":290 
.673,"temp_max":290.673,"sea_level":1019.21,"grnd_level":1009.48},"wind":{"speed":4.3,"deg":93.0027} 
,"rain":{"3h":0.1375},"clouds":{"all":92},"dt":1462884891,"sys":{"message":0.0043,"country":"GB","sunrise" 
:1462853704,"sunset":1462909185},"id":2643743,"name":"London","cod":200}

來源

2016-05-10 JohnnyBizzle

如果你提供什麼樣的getCurrentPostion超時選項，這樣navigator.geolocation.getCurrentPosition（函數（位置）{/ *成功* /}，函數（）{/*失敗* /}，{timeout：5000}）; – SSA

你可以做的是設置具有呼叫setInterval函數的計時器。

在計時器功能中，您可以檢查您將在之後設置的標記navigator.geolocation檢查通過。

只有在間隔功能，你會把邏輯。

只是不要忘記清除計時器，以避免不必要的電話。

代碼可以是這樣的：

var timer = setInterval(function(){ 
    if(geoReady){ 
     // clear interval 
     window.clearInterval(timer); 

     // do your logic 
    }, 300 
} 

if (navigator.geolocation) { 
    geoReady = true; 
} 
else { 
    // clear interval 
     window.clearInterval(timer); 

}

來源

2016-05-10 14:36:47 Ygalbel

我結束了使用IP地址的位置，但我相信這個代碼將工作。謝謝。 – JohnnyBizzle

如何在用戶允許訪問後使用瀏覽器GeoLocation

回答

相關問題