谷歌地图自动完成不工作

我在这里遇到一个非常奇怪的问题。我能够在JsFiddle上运行代码，但无法在Codepen上运行确切的代码。我是不是能够在我的本地运行它。请鳍链接 - 以下谷歌地图自动完成不工作

的JavaScript Used-

var placeSearch, autocomplete; 


function initAutocomplete() { 
    autocomplete = new google.maps.places.Autocomplete(
(document.getElementById('autocomplete')), 
     {types: ['geocode']}); 

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

function geolocate() { 
    if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position) { 
     var geolocation = { 
     lat: position.coords.latitude, 
     lng: position.coords.longitude 
     }; 
     var circle = new google.maps.Circle({ 
     center: geolocation, 
     radius: position.coords.accuracy 
     }); 
     autocomplete.setBounds(circle.getBounds()); 
    }); 
    } 
}

来源

2016-12-03 theLearner

你的钥匙未经授权，CodePen：'谷歌地图API的错误：RefererNotAllowedMapError https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map - 错误您的网站的URL将被授权：http：// s.codepen.io/boomerang/ee5c28f48760ef39f4ce481d5c7ac3ff1480776136374/index.html' – geocodezip

如果打开浏览器控制台，你会发现在codepen现场出现以下错误：

RefererNotAllowedMapError exception

Accordintg到Error Messages page：

The current URL loading the Google Maps JavaScript API has not been added to the list of allowed referrers. Please check the referrer settings of your API key on the Google API Console.

See API keys in the Google API Console . For more information, see Best practices for securely using API keys .

要解决此问题：

去Google API Console
下Credentials菜单中选择选择合适的API密钥
在HTTP参照网址添加名单http://s.codepen.io/*

来源

2016-12-03 15:12:23

感谢@Vadim Gremyachev这工作.. :) – theLearner

谷歌地图自动完成不工作

回答

相关问题