摘要：
前面的文章介绍了如何使用key进行调用谷歌地图和实现搜索功能，以及为了防止密钥key被随意调用，我们可以给密钥进行ip地址限制或HTTP网站限制。但用网站限制时，在搜索时会有一个坑......

接着上午的讲，下面讲一个关于密钥限制的坑吧。艺灵在坑中苦苦爬了几个小时，最后索性从坑中挖了条隧道跑出来了，真是坑的不要不要的！！！

一、Google地图密钥回顾

不知道看官有没有忘记怎么查看和给密钥加权限，已经忘记的看官可以按下面的步骤进行巩固下。我们还是先在浏览器中粘贴https://console.cloud.google.com/，然后点击左侧的API和服务，接着点击凭据，如图：进入控制台后选择项目然后点击API和服务接着点击凭据此时会跳转到凭据页面，我们为已创建的密钥进行编辑。点击右侧的小笔即可进入接下来的操作了。如图：接着点击右侧的小笔即可编辑密钥

二、Google地图开启HTTP限制后无法访问的原因之一

如果看官已经成功的激活了帐号并使用了密钥时页面无法访问并显示：“糟糕！出了点问题。此页面未能正确加载 Google 地图。请参阅 JavaScript 控制台，了解技术详情。”字段或控制台报：This IP, site or mobile application is not authorized to use this API key. 时说明我们添加的站点规则有问题。为了让错误重演，艺灵故意写错网址，错误图如下：错误的HTTP引荐来源会导致谷歌地图无法加载

解决的方法也很简单，填写正确的域名即可。来张修改后的效果图吧！填写正确的HTTP引荐来源才能成功加载谷歌地图

怎么样，谷歌地图已经成功加载了。是不是很开森？

你以为艺灵写这篇文章就是为了这个低级错误吗？当然不是了！因为一个很大很大的萝卜坑已经挖好了，就等着看官往下跳呢！

三、开启HTTP权限后谷歌地图加载正常，但搜索失败！

不理解小标题没事，如果看官的项目中需要用到谷歌地图，可能就已经踩过此坑了。今晚艺灵在这个问题上花费了几个小时，控制台中在发出请求后一直报：error_message:"API keys with referer restrictions cannot be used with this API."这个错误！如图：一步步排除了：缓存、https、HTTP引荐规则等都无果！在网上搜索error_message:"API keys with referer restrictions cannot be used with this API."此错误的话，也会看到有不少文章提及这个错误，即使是谷歌官方的文档(咳咳，全是英文，翻译的好无奈......)，艺灵也没有看到简单明了的解决方案。

谷歌的官方文档(戳我看看)中是这样解释这个问题的：
How do I resolve the error: "API keys with referer restrictions cannot be used with this API."?
You are using any of the web service APIs with an API key restricted to an HTTP referer. For security reasons, web service APIs need to use API keys restricted to IP addresses. Switch your key restriction type from an HTTP referer restriction to an IP address restriction, or create a new API key if your key is already used with the Maps JavaScript API. 。

难道这是让我切换成IP验证或开两个密钥，一个用于展示，另一个用IP验证的密钥进行搜索吗？经测试发现这种方法确实可行！但这也有点太......

四、去掉key也可解决问题

随后艺灵在这篇帖子中找到了一个折中的方法，戳我看解决方案 提问者自己发现：去掉key后就不会报错了。经测试发现确实这样，我们把之前的搜索地点接口：
https://maps.googleapis.com/maps/api/geocode/json?address='+address+'&key='+keys
修改成
https://maps.googleapis.com/maps/api/geocode/json?address='+address，
然后扔浏览器就中能跑，这坑也是没得谁了！但是，连续搜索几次（艺灵测试是第9次）后就不能搜索了，控制台会继续报如下错误："error_message" : "You have exceeded your daily request quota for this API. We recommend registering for a key at the Google Developers Console: https://console.developers.google.com/apis/credentials?project=_",

五、为什么非要HTTP验证而不用ip验证呢？

艺灵我也想用ip验证啊，多省事，直接丢一个ip过去就全通过，但是！经测试发现此ip是访客的ip，而非服务器本身ip！
什么意思呢，举例来说：当看官用域名访问艺灵的网站www.yilingsj.com时会携带一个访客的ip过来，而网站在收到请求后也会同样返回给客户端一个服务器的ip。网站返回的ip并不一定都是原服务器的ip，因为这之间可能会经过cdn或一些防护平台的保护。看官肯定有疑问了，好好的网站干嘛还要绕一圈呢？存在即合理，绕圈是多方面原因的，比如：给网站加速、抗DDOS攻击、抗CC攻击等原因。

这个扯远了，刚说到ip。当艺灵在谷歌地图密钥限制那里填写的是服务器的ip时，测试页面并不能正常访问。于是艺灵又换了个站点，一个裸奔的服务器ip仍不能访问！当艺灵添加的是客户端ip地址时，也就是艺灵翻墙后的国外ip时，奇迹出现了！谷歌地图功能可以访问了！！！

那问题就来了，访问者来自五湖四海，我并不知道访问者的ip是多少啊！如果靠ip验证的话，那得有多少访客即使能浏览网页但也无法使用网页中的谷歌地图功能啊！所以，用域名的方式比较理想点。因为域名验证不会验证访客的ip，只是验证调用谷歌地图接口的代码是不是在这个指定的域名上，如果是就可以使用。这样就起到了防盗用的目的。像某些平台例如：微信、新浪等会对图片盗用做些手脚。说直白点就是：当你在网页中引用了某某微信公众号里的图片时，前台访问会无法加载图片并有相关提示信息。

六、最后

有兴趣的看官可以戳我体验下谷歌地图的搜索及定位功能，该案例中的密钥key用的是HTTP引荐来源验证，而搜索功能则去掉了key。每天只有10次的搜索机会，当他人已经搜索过10次时，看官再搜索就没有效果了，控制台会报错："error_message" : "You have exceeded your daily request quota for this API. We recommend registering for a key at the Google Developers Console: https://console.developers.google.com/apis/credentials?project=_",

----------完----------

转载声明：
　　若亲想转载本文到其它平台，请务必保留本文出处！
本文链接：/xwzj/2018-07-23/google-maps-api-key.html

若亲不想直保留地址，含蓄保留也行。艺灵不想再看到有人拿我的技术文章到他的地盘或者是其它平台做教(装)程(B)而不留下我的痕迹。文章你可以随便转载，随便修改，但请尊重艺灵的劳动成果！谢谢理解。