故障排除 Font Awesome 无法在 WordPress 上的 Chrome 中运行

Question

我的 Font Awesome 图标正在 Firefox 和 Safari 中加载，但在 Chrome 中没有。

在清除浏览器缓存并重新启动/重新加载 apache 之前，我已将以下几行添加到我的网络服务器的 .htaccess 文件中：

<FilesMatch "\.(ttf|otf|eot|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule> 
</FilesMatch>

这是检查告诉我的：

Font from origin 'https://www.portalpay.io' has been blocked from loading
by Cross-Origin Resource Sharing policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'https://portalpay.io' is therefore not allowed access.

我正在使用在 Digital Ocean Ubuntu 12.04 droplet 上运行的 WordPress 和 apache。我还尝试在 htaccess 中添加一些行，但这会阻止网站加载。

Answer 1

我也尝试在 htaccess 中添加一些行

你不需要这样做。

来自https://www.portalpay.io 的字体已被阻止加载 通过跨域资源共享策略： 请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin https://portalpay.io 因此不允许访问。

这里的问题只是您通过https://portalpay.io 加载您的网站，然后尝试从https://www.portalpay.io 加载字体 - 这是不同的来源。

是的，发送带有字体资源响应的 Access-Control-Allow-Origin 标头可以解决此问题 - 但更简单的解决方案是从与网站本身相同的地址加载字体。

所以去检查你的样式表或字体加载器，看看它在哪里尝试从 www 地址请求字体，并将其替换为非 www 版本。