取消状态阻止字体下载

Question

我有一个页面，其中有一些文本已被赋予 font-family 宪法：

此字体是从一家铸造厂下载的，并为带有 @font-face 的页面定义：

当页面呈现时，浏览器会寻找字体，但请求被取消阻止并且文本没有得到 font-family 应用：

有谁知道可能导致取消的原因吗？这曾经有效，我无法想象我做了什么或发生了什么破坏它。

感谢您的帮助。

Answer 1

Access-Control-Allow-Origin header 预计只有一个来源，或通配符 (*)。

你在问题的评论中提到的错误（“'Access-Control-Allow-Origin' header包含多个值......但只允许一个”）明确表明[=10中有多个值=] header，或者有多个Access-Control-Allow-Origin headers.

要解决此问题，应该只有一个 Access-Control-Allow-Origin header，只有一个原始值。

如问题中所述：“这曾经有效”。我猜这个问题是由于不小心在服务器配置中添加了额外的 Access-Control-Allow-Origin header 造成的。

作为参考，请查看 W3C specification:

A resource can have one Access-Control-Allow-Origin header defined. The header must match the following ABNF:

Access-Control-Allow-Origin = "Access-Control-Allow-Origin" ":" ascii-origin | "*"

ascii-origin = ASCII serialization of an origin

Answer 2

将其放入您的 虚拟主机 定义或 .htaccess 文件中：

<FilesMatch ".(ttf|otf|woff|woff2|eot|ttc)$">
    Header set Access-Control-Allow-Origin "*"
    Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
</FilesMatch>

重新启动 Apache 网络服务器
多次刷新页面（硬刷新）

取消状态阻止字体下载

canceled status blocking font download

http

fonts

request-cancelling