Laravel公共文件夹配置CORS解决字体跨域访问受阻问题

问题根源 #

Laravel的config/cors.php配置仅对经过Laravel路由处理的请求生效（比如API接口），而public目录下的静态资源（字体、CSS）是直接由Web服务器（Apache/Nginx）处理的，所以这份配置对字体文件无效。你之前添加的.htaccess规则可能因为位置不对、模块未启用或语法问题没生效。

具体修复步骤 #

1. 确保Apache启用mod_headers模块 #

在终端执行以下命令启用模块（以Ubuntu/Debian为例）：

sudo a2enmod headers
sudo systemctl restart apache2

2. 调整Laravel的.htaccess规则位置 #

Laravel默认的.htaccess在public目录下，需要把你的CORS规则放在RewriteEngine On之前，避免被重写规则覆盖：

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

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Send Requests To Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

注意：移除FilesMatch中的CSS规则（你已确认CSS可正常加载），同时修正引号为普通双引号，避免转义问题。

3. 清除浏览器缓存 #

浏览器会缓存静态资源的响应头，按Ctrl+Shift+R强制刷新页面，或直接清空浏览器缓存后再测试。

4. 若使用Nginx作为Web服务器（可选） #

如果Laravel部署在Nginx环境，需在Nginx配置文件中添加以下规则：

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

修改后重启Nginx：

sudo systemctl restart nginx

验证方法 #

打开浏览器开发者工具（F12），切换到网络标签，刷新页面后找到字体请求，查看响应头中是否存在Access-Control-Allow-Origin: *，存在则配置生效。

内容的提问来源于stack exchange，提问作者Artier