如何在Firefox中使用@ font-face的数据uri [英] How to use a data uri with @font-face in Firefox
问题描述
我正在为一个公共wifi接入点设计一个初始页面，Firefox拒绝显示我的自定义字体，而它在每个其他浏览器中工作（好，不是IE <9，但是这是预期的）。
I am designing a splash page for a public wifi access point and Firefox refuse to display my custom font, while it work in every other browser (well, not IE < 9 but that was expected).
页面需要在以下约束中工作：
The page need to work in the following constraint :
- 互联网：此页面在用户接受条款和条件之前显示，因此一切都被阻止
- 页面存储在接入点上：这意味着嵌入式服务器可能用C编写，我不能真正添加额外的标题或东西。它的开源，所以它可能是，但我绝对不是一个嵌入式开发人员！
- WiFi是用来做广告它提供的小镇，所以应该
为了满足这些约束，我使用了@ font-face和一个数据uri，例如：
To meet those constraint I used the @font-face with a data uri, like so :
@font-face {
font-family: Lato-Light;
src: url(data:application/font-woff;base64,<large base64 string>)
format('woff');
}
h1{
font-family: Lato-Light, Helvetica, sans-serif;
}
它像一个魅力...除了在Firefox。现在我明白，它将不工作在旧的IE，但我准备工作。但对我来说，看起来很奇怪，所谓的现代浏览器不会提供这个功能。为什么不工作？
It work like a charm... Except in Firefox. Now I understand that it won't work in older IE, but I am ready to work with that. But it seem strange to me that a so-called modern browser would not offer that feature. Why isn't this working?
编辑：当然，我有很多想法回退，但我的问题在这里更多：为什么firefox有这样的行为是不是与其他浏览器相同？这是安全设置吗？ data-uri实现中的错误？数据uri的大小限制？
EDIT : Of course, I have a lot of idea for fallback, but my question here is more : Why does firefox have this behavior that is not the same as the other browsers? Is it a security setting? A bug in the data-uri implementation? A size limit for the data-uri?
推荐答案
最后，问题是我使用了一个woff字体生成器不正确的字体。 Safari和IE能够读取它，但Firefox和最新版本的Chrome拒绝了，因为它包含一些错误。
In the end, the problem was that I used a woff font generator that produced an incorrect font. Safari and IE were able to read it, but Firefox and the latest version of Chrome rejected it since it contained some errors. By using a more recent woff font generator, I was able to make it work across all browser.
正确的woff字体生成器
The correct woff font generator
http://people.mozilla.org/~jkew/woff/
有关详情，请检查错误报告：
For more detail, check that bugs report :
https://bugzilla.mozilla.org/show_bug.cgi?id=735556
我要感谢Mozilla的Jonathan Kew提供答案。
I'd like to thank Jonathan Kew of Mozilla for providing the answer.
这篇关于如何在Firefox中使用@ font-face的数据uri的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
