Google지도 geolocation getcurrentposition()

사용자의 현재 위치를 얻으려면 google geolocation의 getCurrentPosition() 함수를 사용하고 있습니다.Google지도 geolocation getcurrentposition()

파이어 폭스에서는 잘 작동하지만 크롬에서는 작동하지 않습니다.

내 코드는 다음과 같습니다 :

<!DOCTYPE html> 
<html> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

<body> 

<p id="demo">Click the button to get your position.</p> 

<button onclick="getLocation()">Try It</button> 

<div id="mapholder"></div> 

<script> 
var x = document.getElementById("demo"); 

function getLocation() { 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(showPosition, showtemp); 
    } else { 
     x.innerHTML = "Geolocation is not supported by this browser."; 
    } 
} 

function showPosition(position) { 
    var latlon = position.coords.latitude + "," + position.coords.longitude; 

    var img_url = "http://maps.googleapis.com/maps/api/staticmap?center=" 
    +latlon+"&key=AIzaSyDOgvRydLLNrztjgagobYS_sROK1u3r4M4&zoom=14&size=400x300&sensor=false"; 
    document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>"; 
} 
function showtemp(temp) { 
    alert("test"); 
    } 

function showError(error) { 

    $.get("http://ipinfo.io", function (response) { 
     var array = (response.loc).split(','); 
     console.log(array[0]); 
     var latlon = array[0] + "," + array[1]; 
     var img_url = "http://maps.googleapis.com/maps/api/staticmap?center=" 
     +latlon+"&zoom=14&size=400x300&sensor=false"; 
      document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>"; 
    }, "jsonp"); 
} 
</script> 

</body> 
</html>

날이 문제를 해결 도와주세요.

오류 : "getCurrentPosition() 및 watchPosition()이 불안정한 출처에서 사용되지 않으며 향후 지원이 제거 될 예정이므로 응용 프로그램을 HTTPS와 같은 안전한 출처로 전환하는 것을 고려해야합니다." 사전

출처

2016-08-27 Shah Ankit

크롬에서 작동하지 않습니다. 콘솔에서 오류가 발생하는 것보다 효과적입니다. 크롬의 콘솔 오류로 질문을 업데이트 하시겠습니까 ?? – Bhavin

getcurrentposition()이 삭제되고 대체 할 수 없습니다.이 답변을 읽으십시오 : - [getcurrentposition-and-watchposition-are-deprecated-on-insecure-origins] (http://stackoverflow.com/questions/32106849/getcurrentposition-and-watchposition-are-deprecated-on-insecure-origins) – Bhavin

최신 크롬 버전 = 52로 작업 할 수있는 방법이 있습니까? –

getcurrentposition에서

덕분에() deprected하고 그것의 대체가 없습니다. 이 대답을 읽으십시오 : - getcurrentposition-and-watchposition-are-deprecated-on-insec‌ure-origins

이 google updated api의 예제 링크를 클릭하면 작동하는 예제가 나타납니다. : https://developers.google.com/maps/documentation/javascript/examples/map-geolocation.

코드 블록의 오른쪽 상단에 마우스를 가져 코드를 복사하거나 JSFiddle에서 엽니 다.

사용이 기능 :

// Note: This example requires that you consent to location sharing when 
// prompted by your browser. If you see the error "The Geolocation service 
// failed.", it means you probably did not give permission for the browser to 
// locate you. 

<script> 
    function initMap() { 
     var map = new google.maps.Map(document.getElementById('map'), { 
     center: {lat: -34.397, lng: 150.644}, 
     zoom: 6 
     }); 
     var infoWindow = new google.maps.InfoWindow({map: map}); 

     // Try HTML5 geolocation. 
     if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function(position) { 
      var pos = { 
      lat: position.coords.latitude, 
      lng: position.coords.longitude 
      }; 

      infoWindow.setPosition(pos); 
      infoWindow.setContent('Location found.'); 
      map.setCenter(pos); 
     }, function() { 
      handleLocationError(true, infoWindow, map.getCenter()); 
     }); 
     } else { 
     // Browser doesn't support Geolocation 
     handleLocationError(false, infoWindow, map.getCenter()); 
     } 
    } 

    function handleLocationError(browserHasGeolocation, infoWindow, pos) { 
     infoWindow.setPosition(pos); 
     infoWindow.setContent(browserHasGeolocation ? 
          'Error: The Geolocation service failed.' : 
          'Error: Your browser doesn\'t support geolocation.'); 
    } 

</script>

출처

2016-08-27 10:17:20 Bhavin

'이 jsfiddle 링크에서 업데이트 된 API의 작동 예제입니다. '- 비어 있습니다. - 실패했습니다. –

감사합니다. 그것을 지적 :) 나는 내 대답을 업데이 트 jsfiddle 링크는 Google의 작업 예제 그래서 우리가 여기 그것을 사용하면 비어있을 수 있습니다. 그래서 작업 예제의 링크로 내 질문을 업데이 트했습니다. 호스트 도메인 용 – Bhavin

위치 정보는 그 자체가되지 않는 것이 아니라, 사이트에 대한 제한은 HTTPS를 통해 제공됩니다.

는 경고 자체가 읽기 페이지 HTTP가 아닌 HTTPS를 통해 제공에 내려 boilds, "getCurrentPosition() 및 watchPosition() 불안 기원에 를 사용되지 않습니다."

코드는 최신 Chrome에서 here으로 잘 작동합니다.

SSL을 얻는 가장 쉬운 방법은 콘텐츠를 호스팅하거나 surge을 사용하는 것입니다.

출처

2016-08-27 10:20:03 geekonaut

또는 https://letsencrypt.org/ –

getCurrentLocation() 대신 https://ipinfo.io API (내 서비스)를 사용할 수 있습니다. 최대 1,000 req/day (SSL 지원 여부에 관계없이) 무료입니다. 좌표, 이름 등을 제공하고 비 SSL 사이트에서 작동하며 사용자에게 권한을 묻지 않습니다. 당신이 getCurrentPosition()에서 무엇을 얻을 일치 여기

curl ipinfo.io 
{ 
    "ip": "172.56.39.47", 
    "hostname": "No Hostname", 
    "city": "Oakland", 
    "region": "California", 
    "country": "US", 
    "loc": "37.7350,-122.2088", 
    "org": "AS21928 T-Mobile USA, Inc.", 
    "postal": "94621" 
}

이 좌표는 API 응답 객체를 구축 예입니다 : 예를 들면 다음과 같습니다이다

$.getJSON('https://ipinfo.io/geo', function(response) { 
    var loc = response.loc.split(','); 
    var coords = { 
     latitude: loc[0], 
     longitude: loc[1] 
    }; 
});

그리고 여기 당신이 그것을 사용하는 방법을 보여줍니다 상세한 예제 getCurrentPosition()에 대한 대체 같이

function do_something(coords) { 
    // Do something with the coords here 
} 

navigator.geolocation.getCurrentPosition(function(position) { 
    do_something(position.coords); 
    }, 
    function(failure) { 
     $.getJSON('https://ipinfo.io/geo', function(response) { 
     var loc = response.loc.split(','); 
     var coords = { 
      latitude: loc[0], 
      longitude: loc[1] 
     }; 
     do_something(coords); 
     }); 
    }; 
});

은 자세한 내용은 http://ipinfo.io/developers/replacing-navigator-geolocation-getcurrentposition를 참조하십시오.

출처

2016-09-23 17:35:20

Google지도 geolocation getcurrentposition()

답변

관련 문제