首页 文章

Google地方搜索框不能仅在我的html页面中使用

提问于
浏览
-2

PLZ帮助,谷歌搜索框在我的HTML页面中无效 . 我甚至在一个新页面尝试过但仍然没有结果 . 它只是表现出来

enter image description here

当我输入任何地方时 . 下面是我使用的代码 .

<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>

1 回答

  • 0

    欢迎来到stackoverflow赛!

    当我将示例代码复制并粘贴到新的html文件并使用Chrome打开时,我会收到与您相同的错误 . 但是在开发者控制台中有一个提示是错误的:

    Google Maps JavaScript API错误:RefererNotAllowedMapError https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error您要授权的网站网址:file_url /.../的test.html

    当您点击上面的链接时,您将得到以下解释:

    RefererNotAllowedMapError加载Maps JavaScript API的当前URL尚未添加到允许的引用列表中 . 请在Google Cloud Platform Console上查看API密钥的引荐来源设置 .

    因此,您必须将此功能的网页网址列入白名单 . 希望这可以帮助!

相关问题