在javascript中实施Google Maps API密钥

时间:2016-12-05 20:31:12

标签: javascript api maps key

我正在绝望地试图通过html页面上的Javascript代码将我创建的地图放在网上(我不是专业的开发人员,我在javascript中特别无知)。只要我将html文件保存在本地,一切都运行正常,但是一旦我将它放在网上,地图就不会显示,我收到了关于丢失密钥的消息。

所以我得到了一把钥匙,但我的问题是找到它是如何工作的。我的地图由以下指令生成:

map = new google.maps.Map(document.getElementById("map"), options);

我尝试添加此脚本:

脚本src =" https://maps.googleapis.com/maps/api/js?key = #####& callback = initMap" async defer

但所有发生的事情都是几个错误,没有地图可见。

有人能帮帮我吗?提前致谢

2 个答案:

答案 0 :(得分:0)

相反,您应该使用google地图网站上获得的iframe。示例:



<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d100994.00356082054!2d-121.9805740058651!3d37.71820818113972!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x808fe65cd6892231%3A0x3b327c848ef64057!2sDublin%2C+CA+94568!5e0!3m2!1sen!2sus!4v1480970198759" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

转到google developer console中的凭据页面,然后在顶部,您会看到域名验证标签点击该标签,然后点击添加域按钮为了添加从您的网站加载的域名。

如果这样做,您将不需要API密钥。多亏了这一点,Google可以跟踪您的请求。

重要提示

我不确定是否会出现这种情况,但请注意,一旦您添加经过验证的域名,请确保以前生成的密钥未用于Google Map的网页像API这样的服务,否则API会在添加域后返回错误。