как исправить.[Deprecation] getCurrentPosition () и watchPosition () больше не работают с небезопасными источниками.

Question

Я получил одну консольную ошибку при попытке запустить код на моем временном сервере: «[Deprecation] getCurrentPosition () и watchPosition () больше не работают с небезопасными источниками. Чтобы использовать эту функцию, следует рассмотреть возможность переключения приложения набезопасный источник, такой как HTTPS ".

в моем заголовке я связываю тег сценария.

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBlS6vRUDeM0XdliZ4iWDyDMekH45wYcck&libraries=places" type="text/javascript"></script>

Получите вашу текущую позицию: нажмите здесь

    <p id="demo"></p>

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

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

    function showPosition(position) {
        x.innerHTML = "Latitude: " + position.coords.latitude + 
        "<br>Longitude: " + position.coords.longitude;
        document.getElementById('cityLat').value = position.coords.latitude;
        document.getElementById('cityLng').value = position.coords.longitude;
    }
    </script>
    <script type="text/javascript">
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var bangalore = new google.maps.LatLng(12.9716, 77.5946);
  var myOptions = {
    zoom:12,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: bangalore
  }

  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  directionsDisplay.setMap(map);
}

function calcRoute() {
  var startLat = document.getElementById('cityLat').value;
  var startLong = document.getElementById('cityLng').value;

  var endLat = $('select.end').find(':selected').data('lat');
  var endLong = $('select.end').find(':selected').data('long');

  /*alert(startLat+"---"+startLong+"---"+endLat+"---"+endLong);*/

  if(startLat && startLong){
    var start = new google.maps.LatLng(startLat, startLong);
  }else{
    var start = document.getElementById("start").value;
  }

  var end = new google.maps.LatLng(endLat, endLong);

  var distanceInput = document.getElementById("distance");

  var request = {
    origin:start, 
    destination:end,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
  };

  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
      distanceInput.value = response.routes[0].legs[0].distance.value / 1000;
    }
  });
}
</script>

, когда яЗапустите приведенный выше фрагмент кода в моей локальной системе, и я получаю карту правильно.

Когда я перемещаю код на сервер тестирования, появляется ошибка консоли "[Deprecation] getCurrentPosition () и watchPosition () больше не работают в небезопасныхПроисхождение. Чтобы использовать эту функцию, вам следует подумать о том, чтобы переключить ваше приложение на безопасный источник, например HTTPS "

Я пробовал без https ссылки на источник тега сценария.

Кто-нибудь мог бы вы дать мнепредложение для этого?Спасибо.

Answer 1

Chrome запретил использование getCurrentPosition () для веб-сайтов без SSL.

API Карт Google может решить эту проблему, но его пределы использования слишком низки.

Answer 2

Вам необходимо установить сертификат SSL.Нет быстрого решения для этого решения.Google Chrome и другие браузеры блокируют это по соображениям безопасности.