2017-02-27 81 views
-2

這是我在javascript文件下運行時得到的錯誤爲什麼地理位置HTML5 getCurrentPosition()在Google Map上不起作用?

getCurrentPosition()和watchPosition()不再適用於不安全的起源。要使用此功能,您應該考慮將應用程序切換到安全的來源,例如HTTPS。有關更多詳情,請參閱https。

這是我的JavaScript文件

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script 
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA4HSRrQSje--aI6ImtJF30s5ezaUWxsow&libraries=places"></script> 

<script> 
function getLocation() 
    { 
     console.log("In geolocation"); 
     if (navigator.geolocation) 
     { 
     navigator.geolocation.getCurrentPosition(showPosition); 
     } 
     else 
     { 
     print("Browser doesn't support geolocation"); 
     } 

function showPosition(position) 
    { 
     console.log("in show position"); 
     dest_lat=position.coords.latitude; 
     dest_long=position.coords.longitude; 

     url = 'https://maps.googleapis.com/maps/api/geocode/json?latlng='+ dest_lat + ',' + dest_long + '&sensor=false'; 
     $.get(url, function(data) 
      { 
        if (data.status == 'OK') 
        { 
         map.setCenter(data.results[0].geometry.location);     
          console.log("Dragaed lat "+marker.getPosition().lat()); 
          console.log("Dragged lng "+marker.getPosition().lng()); 
          console.log("Address "+data.results[0].formatted_address); 
        } 
       }); 
    } 
</script> 
</head> 
<body> 
<input type="button" value="LocateMe" onclick="getLocation();"/> 
</body> 
</html> 
+1

錯誤信息非常明確,什麼都不用你瞭解了嗎?您不能在未通過https提供的頁面上使用這些功能。 – baao

+0

嘿! Baoo。我可以看到錯誤。我能夠理解它。但我在解決它時遇到了問題。最後,我明白了。這只是我是網頁編程的新手。謝謝。 –

回答

0

你必須把它放在一個服務器https://https://dotnetcodr.com/2015/09/18/how-to-enable-ssl-for-a-net-project-in-visual-studio/ Alternativelyyou可以測試它jsfiddler,它使用https每默認:

如果您正在使用Visual Studio,你可以看到https://配置午餐現場。

除此之外,您的代碼還有很多其他錯誤。

  • 括號不匹配
  • map對象並不在你的例子
  • 可變因素沒有聲明定義(它們被加入到全局命名空間,其可以在以後導致一些真正討厭的問題,並拋出一個錯誤當您使用"use strict"

這裏是一個的jsfiddle工作excample:https://jsfiddle.net/3gkkvs50/ (計算器不使用https的例子)

HTML:

<input type="button" value="LocateMe" onclick="getLocation();" /> 

JS:

function getLocation() { 
    console.log("In geolocation"); 
    if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(showPosition); 
    } else { 
    print("Browser doesn't support geolocation"); 
    } 
} 

function showPosition(position) { 
    console.log("in show position"); 
    var dest_lat = position.coords.latitude; 
    var dest_long = position.coords.longitude; 

    var url = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + dest_lat + ',' + dest_long + '&sensor=false'; 
    $.get(url, function(data) { 
    alert(JSON.stringify(data)); 
    }); 
} 
+0

這對我很有用,我對問題和解決方案也有清晰的瞭解。謝謝Stefan。 –

+0

然後請接受答案:) – Stefan