谷歌地图 - 跨源请求被阻止：同源策略不允许读取远程资源

Question

我正在使用谷歌地图 api，在页面上我有这个

<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500">

现在，正因为如此，正如您在此链接中看到的

https://fonts.googleapis.com/css?family=Roboto:300,400,500有字体文件 - 包含在 url 中，AFA 我知道它会导致问题。在萤火虫中它显示

跨源请求被阻止：同源策略不允许读取 https://themes.googleusercontent.com/static/fonts/roboto/v11/2UX7WLTfW3W8TclTUvlFyQ.woff上的远程资源 这可以通过将资源移动到同一域或启用 CORS。

即使尝试将其添加到我的 htaccess 中，也不起作用，它仍然在 firebug 中显示错误

Header set Access-Control-Allow-Origin: *

apache 的 headers mod 已启用，我设置了其他 headers 并且没问题。我使用的是 xampp 1.7.4。我也不想将 css 文件和/或字体移动到我的本地文件中，因为谷歌将来可能会进行更改。

qsn1：如何处理这个错误。

qsn2：为什么它只显示那些字体文件的错误？因为例如我也包含了谷歌地图API的脚本，并且没有问题。

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>

谢谢

Answer 1

我收到错误是因为启用了 Adblock。禁用 Adblock 解决了问题

Answer 2

我在 Firefox 中，在 HTTPS 页面上，以及通过 HTTPS 连接从 fonts.googleapis.com 加载样式表时，就发生了这种情况。就我而言，我使用“协议相对链接”，即“//fonts.googleapis.com/”而不是“ https://fonts.googleapis.com/ ”，无论如何，发生了与您描述的情况相同的情况。具体来说，样式表通过 HTTPS 连接正确加载，但是样式表中引用的一些 WOFF 文件未加载，因为它们被 Firefox 阻止，控制台中出现 CORS 警告。

我修复了其他一些不相关的问题，其中一些其他脚本加载不正确（已设置为通过 HTTP 而不是 HTTPS 加载一个脚本）。解决了这个问题，然后我注意到 Google 字体问题突然得到了解决。不确定这是否是巧合。

我的建议：确保首先修复浏览器中报告的所有其他问题/警告/错误，然后查看此问题是否再次出现。如果做不到这一点，我要么归咎于 Google 的服务器配置问题，要么归咎于我们自己的服务器上的服务器配置问题:)