从静态域提供字体会导致 CORS 问题 - Wordpress - Nginx答案

【问题标题】：serving fonts from static domain causes CORS issues - Wordpress - Nginx从静态域提供字体会导致 CORS 问题 - Wordpress - Nginx
【发布时间】：2017-03-18 04:34:46
【问题描述】：

我在 Nginx / Ubuntu、Digital Ocean Droplet 上安装了一个 Wordpress 站点。

目前，我正在优化页面性能。 Pingdom FPT 建议通过无 cookie 域提供静态文件。我已经设置好了，现在它正在从静态子域提供文件。

但是，我遇到了 CORS 问题：

使用 Chrome 控制台：

CORS 策略已阻止从源“http://static.ux-labs.com”访问“http://static.ux-labs.com/themes/uxlabs/betheme/fonts/mfn-icons.woff?3416171”处的字体：请求的资源上不存在“Access-Control-Allow-Origin”标头。

Origin 'http://ux-labs.com' 因此不允许访问。（索引）：1 从源“http://static.ux-labs.com”对“http://static.ux-labs.com/plugins/js_composer/assets/lib/bower/font-awesome/fonts/fontawesome-webfont.woff2?v=4.5.0”字体的访问已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。

Origin 'http://ux-labs.com' 因此不允许访问。

我尝试添加到主题 header.php

<?php /** @package WordPress @subpackage Default_Theme  **/
    header("Access-Control-Allow-Origin: *"); 
?>

但它不起作用。

我也尝试在 nginx 中添加 server.conf

location ~* \.(eot|otf|svg|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin *;
    expires max;
}

【问题讨论】：

这方面有进展吗？

标签： wordpress nginx cors

【解决方案1】：

它应该像您在“标准” nginx 配置中编写的那样工作......

location ~* \.(eot|otf|svg|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin *;
    expires max;
}

需要注意的一点是，您要确保在正则表达式中没有其他带有这些文件扩展名的位置块。我有 2 个使用字体文件扩展名声明的块，第一个块加载但不是我的 CORS 策略块。一旦我只用这些扩展加载了 1 个块，一切正常。

如果没有看到你的完整配置，你很难判断它可能在哪里失败。

【讨论】：