Окно поиска мест Google не работает только на моей HTML-странице

Question

Пожалуйста, помогите, окно поиска Google Place не работает на моей HTML-странице.Я пытался даже на новой странице и до сих пор не получилось.Это просто показывает, как

, когда я набираю любое место. Ниже приведен код, который я использовал.

<div id="locationField">
    <input id="autocomplete" placeholder="Enter your address" type="text" />
  </div>
  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCKQX3cyZ7pVKmBwE8wiowivW9qH62AVk8&libraries=places&callback=initAutocomplete" async defer></script>
  
  <script>var placeSearch, autocomplete, geocoder;

function initAutocomplete() {
  geocoder = new google.maps.Geocoder();
  autocomplete = new google.maps.places.Autocomplete(
      (document.getElementById('autocomplete'))/*,
      {types: ['(cities)']}*/);

  autocomplete.addListener('place_changed', fillInAddress);
}

function codeAddress(address) {
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == 'OK') {
        alert(results[0].geometry.location);
      } else {
        alert('Geocode was not successful for the following reason: ' + status);
      }
    });
  }

function fillInAddress() {
  var place = autocomplete.getPlace();
  alert(place.place_id);
  //   codeAddress(document.getElementById('autocomplete').value);
}</script>

Answer 1

Добро пожаловать в stackoverflow Sai!

Когда я копирую и вставляю ваш пример кода в новый HTML-файл и открываю его в Chrome, я получаю ту же ошибку, что и вы.Но в консоли разработчика есть подсказка, что не так:

Ошибка API JavaScript Карт Google: RefererNotAllowedMapError https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error

URL вашего сайта для авторизации: file_url / ... / test.html

Когда вы перейдете по ссылке выше, вы получите следующее объяснение:

RefererNotAllowedMapError

Загрузка текущего URLJavaScript API Карт не был добавлен в список разрешенных ссылок.Пожалуйста, проверьте настройки реферера вашего ключа API в консоли Google Cloud Platform.

Таким образом, вы должны внести URL-адрес своих страниц в белый список для этой функции.Надеюсь, это поможет!