Firefox上的可下载字体：不允许使用错误的URI或跨站点访问 [英] Downloadable font on firefox: bad URI or cross-site access not allowed

问题描述

我是 http://www.beperk.com 的网站管理员（我向您提供网址，以便您能够检查问题），我在CSS中使用@ font-face时遇到很多问题。

我想使用zurb dot com的基础，所以我托管他们在Amazon S3。

我设置了存储桶以允许跨域访问，如此处所指定：http://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html#how-do-i-able- cors

一切都开始在webkit，trident和gecko无缝工作...主要是：当使用firefox浏览网页时（版本17,18和19测试）所有图标随机出现此错误：

 时间戳：22/02/13 13:18:01 
错误：可下载的字体：下载失败（font-family：GeneralFoundicons样式：正常重量：正常拉伸：正常src索引：1）：不允许URI或跨站点访问
  

然后我说，随着页面的完全重新加载（用控制/命令+ R）后，每个单个图标正常出现，在一些访问后再次失败。

任何人都能找到问题吗？我做错了什么？

非常感谢！

解决方案

您需要添加：

 访问控制允许原始
  pre> 
 
 
到字体文件的头部，例如，如果你使用Apache，你可以将它添加到.htaccess：
 < FilesMatch\。（ttf | otf | eot | woff | woff2）$> 
< IfModule mod_headers.c> 
标题集Access-Control-Allow-Origin*
< / IfModule> 
< / FilesMatch> 
  
 
I'm a webmaster at http://www.beperk.com (I'm giving you the url so you are able to check the problem) and I'm having lots of problems using @font-face in CSS.

I want to use the foundicons from zurb dot com so I hosted them at Amazon S3.

I set up the bucket to allow crossdomain access as specified here: http://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html#how-do-i-enable-cors

And everything started to work seamless at webkit, trident and gecko... mostly: when browsing the web with firefox (version 17, 18 and 19 tested) all the icons fails randomly with this error:
Timestamp: 22/02/13 13:18:01
Error: downloadable font: download failed (font-family: "GeneralFoundicons" style:normal weight:normal stretch:normal src index:1): bad URI or cross-site access not allowed
And I say randomly since after a full reload of the page (with control/command + R) every single icon appears normally to fail again after some visits.

Can anyone find the problem? What am I doing wrong? 

Thank you very much in advance!
解决方案
On your server you will need to add: 
Access-Control-Allow-Origin
To the header of the font files, so for example if you are using Apache you can add this to the .htaccess:
<FilesMatch "\.(ttf|otf|eot|woff|woff2)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>


                        
这篇关于Firefox上的可下载字体：不允许使用错误的URI或跨站点访问的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！