Question

我想要的是什么：

我需要添加一些动态CSS样式，其中包含来自需要身份验证的不同域的字体到页面：

问题：

Firefox不会在字体请求中发送cookie（在Chrome中一切正常）

情况：

Firefox v.30.0。 CSS文件和Font的来源位于不同的域中（例如，外部域称为“ bbb.com ”）。外域“bbb”需要身份验证。成功验证后，客户端会收到带有php会话ID的cookie，该会话ID用于所有其他请求“bbb.com”域。

示例：

域“bbb.com”的身份验证已成功执行
通过AJAX请求url“https://bbb.com/issue2604dead.css”客户端接收CSS文件的内容，如字符串
Javascript创建包含上一步收到的内容的元素
CSS样式工作正常，受影响元素的样式也发生了变化;
CSS中的一个定义是遵循FONT参考：@font-face{font-family:dead_3;src:url(https://bbb.com/dead_3.ttf)format("opentype");}
浏览器尝试从网址获取字体，但客户端收到响应状态“401 Unauthorized”;

编辑：

我在jsFiddle上做了示例：http://jsfiddle.net/RightFiveLeft/Pu4C2/9/

我发现Firefox没有发送Cookie，因为引用是在DOM元素中设置的。如果您通过ajax浏览器加载相同的资源，则会发送cookie。

所以在我的jsFiddle Cookie示例中，不会发送DOM元素链接创建的CSS请求。

已编辑2

我很抱歉我在jsFiddle中添加了错误的例子。现在在版本9中它应该是最终正确的:-D

Answer 1

你是对的，有一些奇怪的事情发生。在Safari（7.0.5）上，css和字体请求都返回401。如果您在新的Safari选项卡中打开字体或CSS请求，它将返回401.如果您现在再次刷新小提琴，则两个请求都正常工作（200）。

在firefox（31.0）上，字体问题仍然存在。这可能是针对另一个域的请求的firefox策略，或者可能只是一个bug。

我找到了可能相关的内容，但需要访问网络服务器来测试它： CSS @font-face not working with Firefox, but working with Chrome and IE

顺便说一下，即使在其他浏览器中，这些请求的实现也存在一些差异和问题，因此我不会过分依赖cookie的身份验证机制。

另一种方法可能是稍微改变getFile.php的实现，接受GET参数（令牌）进行身份验证。例如，您可以将请求设为：

.../getFile.php?fileName=testFont.ttf&_=1445&token=<auth token>

并针对$_GET['token']而不是Cookie值测试身份验证参数。

如果您不能或不想以这种方式解决，我建议您评估保留（仅）字体而不进行身份验证的可能性。如果这是一个可行的解决方案，最好的选择是从CDN服务。