FontAwesome 无法在 Firefox for Android 上呈现答案

【问题标题】：FontAwesome does not render on Firefox for AndroidFontAwesome 无法在 Firefox for Android 上呈现
【发布时间】：2014-03-21 23:55:35
【问题描述】：

请在 Firefox for Android 版本 28 上查看此页面 (http://www.jungledragon.org/apps/jd3/all/recent) 的渲染图。问题立即可见：所有那些丑陋的块应该是来自图标字体“FontAwesome”的图标。

这是唯一不呈现它们的浏览器。问题出在我的设置中，因为如果我从 Firefox for Android 访问 FontAwesome 网站，那里的图标呈现得很好。另一个有用的线索是“JungleDragon”标志渲染得很好。这是来自 Google 的网络字体。

我一直在尝试排除导致此失败的可能原因。特此进行一些尝试：

我曾经在我的 Amazon S3 账户上托管 FontAwesome 的副本，并在那里设置了 CORS 策略以允许跨源请求。为了确保这不是一个因素，我现在将字体托管在同一个域上。没有区别。

接下来，我将字体的相对路径更改为绝对路径。这也没什么区别。

该网站托管在 Apache 上，我在其中添加了以下内容类型：

AddType application/vnd.ms-fontobject    .eot
AddType application/x-font-opentype      .otf
AddType image/svg+xml                    .svg
AddType application/x-font-ttf           .ttf
AddType font/woff                        .woff

最后一行以前是不同的，但我对其进行了更改，使其与 Google 字体的内容类型完全匹配，该字体确实会呈现。这也没什么区别。

在所有尝试中，我每次都完全清除缓存，所以这也没有问题。

请注意，该字体在其他 Android 浏览器（Chrome、Dolphin）以及我所知道的所有桌面浏览器（包括 Firefox）上都能很好地呈现。

这是我的字体声明：

@font-face {
  font-family: 'FontAwesome';
  src: url('http://www.jungledragon.org/apps/jd3/type/FontAwesome.eot'); 
  src: url('http://www.jungledragon.org/apps/jd3/type/FontAwesome.eot?#iefix') format('embedded-opentype'), url('http://www.jungledragon.org/apps/jd3/type/FontAwesome.woff') format('woff'), url('http://www.jungledragon.org/apps/jd3/type/FontAwesome.ttf') format('truetype'), url('http://www.jungledragon.org/apps/jd3/type/FontAwesome.svg#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

这是加载 FontAwesome 的默认方式。我更改了许多变体（例如先加载 SVG），但都无济于事。

我现在完全不知道为什么我不能让这个字体在 Firefox for Android 上呈现。

【问题讨论】：

标签： android firefox font-awesome icon-fonts

【解决方案1】：

通过远程调试，我能够访问设备的 Firefox 网络控制台。事实证明 Firefox 是在抱怨 CORS。这很奇怪，因为字体与页面托管在同一个域中。尽管如此，通过从 PHP 强制执行 CORS 标头，我还是能够解决问题。

【讨论】：