Geolocation with SSL connection

Question

지구 좌표 좌표를 사용하는 응용 프로그램을 개발 중입니다. 사이트 방문자의 위치를 ​​알아 내기 위해 HTML5 위치 정보 기능을 사용했지만 안전하지 않은 출처에서 GeoLocation을 지원하지 않는 Chrome에서 문제가 발생했습니다.

function showPosition(){ 
    if(navigator.geolocation){ 
     navigator.geolocation.getCurrentPosition(function(position){ 
      var positionInfo = "Your current position is (" + "Latitude: " + position.coords.latitude + ", " + "Longitude: " + position.coords.longitude + ")"; 
      document.getElementById("result").innerHTML = positionInfo; 
     }); 
    } else{ 
     alert("Sorry, your browser does not support HTML5 geolocation."); 
    } 
} 

여기에 내 사이트가 연결 SSL되지 않는 getCurrentPosition가에서 작동하지 않는 코드입니다.

Chrome 경고 : getCurrentPosition() 및 watchPosition()은 더 이상 안전하지 않은 출처에서 작동하지 않습니다. 이 기능을 사용하려면 애플리케이션을 HTTPS와 같은 안전한 출처로 전환하는 것을 고려해야합니다.

크롬에서 좌표/LatLong 값을 가져 오는 다른 방법이 있습니까? [안전하지 않은 연결에 전용]

편집 : 그것은 localhost를 사용하여 내 컴퓨터에서 일하고 : 80 만 HTTP에 테스트 URL이 작동하지 여기

Answer 1

var apiGeolocationSuccess = function(position) { 
    alert("API geolocation success!\n\nlat = " + position.coords.latitude + "\nlng = " + position.coords.longitude); 
}; 

var tryAPIGeolocation = function() { 
    jQuery.post("https://www.googleapis.com/geolocation/v1/geolocate?key=AIzaSyDCa1LUe1vOczX1hO_iGYgyo8p_jYuGOPU", function(success) { 
     apiGeolocationSuccess({coords: {latitude: success.location.lat, longitude: success.location.lng}}); 
    }) 
    .fail(function(err) { 
    alert("API Geolocation error! \n\n"+err); 
    }); 
}; 

var browserGeolocationSuccess = function(position) { 
    alert("Browser geolocation success!\n\nlat = " + position.coords.latitude + "\nlng = " + position.coords.longitude); 
}; 

var browserGeolocationFail = function(error) { 
    switch (error.code) { 
    case error.TIMEOUT: 
     alert("Browser geolocation error !\n\nTimeout."); 
     break; 
    case error.PERMISSION_DENIED: 
     if(error.message.indexOf("Only secure origins are allowed") == 0) { 
     tryAPIGeolocation(); 
     } 
     break; 
    case error.POSITION_UNAVAILABLE: 
     alert("Browser geolocation error !\n\nPosition unavailable."); 
     break; 
    } 
}; 

var tryGeolocation = function() { 
    if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(
     browserGeolocationSuccess, 
     browserGeolocationFail, 
     {maximumAge: 50000, timeout: 20000, enableHighAccuracy: true}); 
    } 
}; 

tryGeolocation(); 

Answer 2

사파리 내 비 SSL 솔루션에

case error.POSITION_UNAVAILABLE: 
// dirty hack for safari 
if(error.message.indexOf("Origin does not have permission to use Geolocation service") == 0) { 
    tryAPIGeolocation(); 
} else { 
    alert("Browser geolocation error !\n\nPosition unavailable."); 
} 
break; 

: 2017/05

var apiGeolocationSuccess = function(position) { 
    alert("API geolocation success!\n\nlat = " + position.coords.latitude + "\nlng = " + position.coords.longitude); 
}; 

var tryAPIGeolocation = function() { 
    jQuery.post("https://www.googleapis.com/geolocation/v1/geolocate?key=AIzaSyDCa1LUe1vOczX1hO_iGYgyo8p_jYuGOPU", function(success) { 
     apiGeolocationSuccess({coords: {latitude: success.location.lat, longitude: success.location.lng}}); 
    }) 
     .fail(function(err) { 
      alert("API Geolocation error! \n\n"+err); 
     }); 
}; 

var browserGeolocationSuccess = function(position) { 
    alert("Browser geolocation success!\n\nlat = " + position.coords.latitude + "\nlng = " + position.coords.longitude); 
}; 

var browserGeolocationFail = function(error) { 
    switch (error.code) { 
     case error.TIMEOUT: 
      alert("Browser geolocation error !\n\nTimeout."); 
      break; 
     case error.PERMISSION_DENIED: 
      if(error.message.indexOf("Only secure origins are allowed") == 0) { 
       tryAPIGeolocation(); 
      } 
      break; 
     case error.POSITION_UNAVAILABLE: 
      // dirty hack for safari 
      if(error.message.indexOf("Origin does not have permission to use Geolocation service") == 0) { 
       tryAPIGeolocation(); 
      } else { 
       alert("Browser geolocation error !\n\nPosition unavailable."); 
      } 
      break; 
    } 
}; 

var tryGeolocation = function() { 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(
      browserGeolocationSuccess, 
      browserGeolocationFail, 
      {maximumAge: 50000, timeout: 20000, enableHighAccuracy: true}); 
    } 
}; 

tryGeolocation(); 

새로운 부분은 "경우 error.POSITION_UNAVAILABLE"이 하나입니다