火狐浏览器不会在@font面声明的跨浏览器请求中发送cookie



我想要的:

我需要添加一些动态CSS样式与字体从不同的域,其中需要身份验证,到页面:

问题:

Firefox在字体请求中不发送cookie(在Chrome中一切正常)

:

Firefox v.30.0。CSS文件和字体的来源是在不同的域(在例子中,是外国域名称为"bbb.com")。外部域名"bbb"需要认证。认证成功后,客户端接收到带有php会话ID的cookie,该cookie用于所有其他请求"bbb.com"域。

例子:

  1. 域名"bbb.com"认证已成功执行
  2. 通过AJAX请求url"https://bbb.com/issue2604dead.css"客户端接收CSS文件的内容,如字符串
  3. Javascript创建具有上一步接收到的内容的元素
  4. CSS样式工作正常,受影响元素的样式被改变;
  5. CSS中的定义之一是以下字体参考:@font-face{font-family:dead_3;src:url(https://bbb.com/dead_3.ttf)format("opentype");}
  6. 浏览器试图从url获取字体,但客户端收到响应状态为"401未经授权";

编辑:

我在jsFiddle上做了一个例子:http://jsfiddle.net/RightFiveLeft/Pu4C2/9/

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

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

编辑2

对不起,我在jsFiddle中添加了错误的示例。现在在版本9中,它应该是正确的:-D

你说得对,确实有些奇怪。在Safari(7.0.5)中,css和字体请求都返回401。如果在新的Safari选项卡中打开字体或css请求,它将返回401。如果现在再次刷新,两个请求都可以正常工作(200)。

在firefox(31.0)上,字体问题仍然存在。这可能是firefox对其他域请求的策略,或者…只是一个bug。

我发现了一些可能相关的东西,但需要访问web服务器来测试它:CSS @font-face不能在Firefox中使用,但可以在Chrome和IE中使用

顺便说一下,看起来即使在其他浏览器中,这些请求的实现也存在一些差异和问题,所以我不会太依赖cookie的身份验证机制。

另一种方法是稍微改变getFile.php的实现,接受GET参数(令牌)进行身份验证。例如,您可以将请求制作为:

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

并测试针对$_GET['token']的认证参数,而不是cookie值。

如果你不能或不想用这种方式解决,我建议你评估一下(只)保留字体而不进行身份验证的可能性。如果这是一个可行的解决方案,最好的选择是从CDN提供。

相关内容

  • 没有找到相关文章

最新更新