IE 11：我自己的代码中出现错误 CSS3111，并且 google.com/fonts 不呈现任何字体

Posted 2023-03-06

【中文标题】IE 11：我自己的代码中出现错误 CSS3111，并且 google.com/fonts 不呈现任何字体

【英文标题】：IE 11: error CSS3111 in my own code, and google.com/fonts doesn't render any fonts

【发布时间】：2016-01-06 12:40:59

【问题描述】：

我正在开发一个使用 Google 字体 Open Sans 的网站，如下所示：

<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700italic,800italic,800,700' rel='stylesheet' type='text/css'>

通常，我在处理我的网站时使用 Chrome，但今天我决定看看它在 Windows 10 上的 IE 11 (11.0.10240.16431) 中的外观。不幸的是，Open Sans 没有正确加载和呈现。我在开发者工具控制台中看到很多这样的错误：

CSS3111: @font-face encountered unknown error.
PRmiXeptR36kaC0GEAetxjqR_3kx9_hJXbbyU8S6IN0.woff

觉得这很奇怪——我之前开发了一个可以在 IE 10 中正常加载 Google 字体的网站——我前往 https://www.google.com/fonts。更多CSS3111 错误，每个自定义字体都显示在serif 中：

谷歌字体是否在 IE 11 上被破坏了？字体确实在 Edge、Chrome、Firefox 等中正确加载。我不知道如何继续让这些字体在 IE 中工作。

更新 1

在 IE 11 中将模拟文档模式设置为 8 会导致字体正确呈现。然而，IE 9+ 仍然存在同样的问题。这可能是 Google 对用户代理字符串的某种不正确处理吗？

更新 2

我去了FontSquirrel并下载了所有格式的Open Sans。我还导入了 ZIP 中提供的 CSS。不幸的是，IE 和现在的 Firefox 继续报告该字体无法使用。火狐说downloadable font: not usable by platform。

更新 3

我已确认 IE 的 字体下载 设置已针对所有安全区域设置为已启用。

【问题讨论】：

我自己在 Linux 上，无法对此进行测试。这应该不重要。但是当你使用 HTTP 而不是 HTTPS 时有什么不同吗？因为我之前在通过 SSL 加载 Google 字体时遇到了问题。

[http]://google.com/fonts 重定向到 [https]://google.com/fonts。即使存在差异，这也不是我网站的选择。该网站通过 HTTPS 提供服务，我们不希望人们的浏览器中出现“不安全内容”警告。

我注意到的一件事是 Google 提供的文件中只有 WOFF URL。我以为 IE 只支持 EOT？

我现在相当确信这是 Windows 10 的 IE 11 版本的回归。我在 Windows Server 2012 R2 的 IE 11 (11.0.9600.18036) 版本上测试了这个网站，字体加载完美。

我使用 Microsoft Connect 向 Microsoft 报告了此问题，并得到了他们无法重现的回复。我详细的错误报告就这么多。他们也基本上说他们不再在IE上工作了。我猜他们想忽略没有人使用 Edge 的事实。

【参考方案1】：

不用担心字体阻塞。将您的字体转换为 base64 并通过 CSS 包含。通过这种方式，您可以通过浏览器代码推送字体，并且不会以通常的方式下载字体文件。 This is also a DISA STIG issue 禁用可下载字体。 The solution can be seen at this post 也复制到这里：

您只需Base64 字体并将其包含在 CSS 文件中。包含对新 FontAwesomeB64.css 的调用后，请确保删除对可下载 WOFF 文件的调用

使用https://www.base64encode.org/ 对 WOFF Font-Awesome 字体文件进行编码。

编辑生成的文件并添加这些行。当您到达 src:url 行时，请确保将其直接运行到您收到的 base64 信息中（不要使用我在此处显示的大于和小于符号。）在该 base64 信息的末尾添加单引号、括号、分号和花括号结束：

@font-face  
font-weight: 400;
font-style: normal;
font-family: 'FontAwesome';
src:url(data:application/x-font-woff;base64,<insert base64 code here>);

您现在有一个 Font-Awesome 字体的 base64 CSS 文件，它绕过浏览器中的所有字体下载拒绝设置。

我发现这适用于所有字体，下载时稍微重一些，但值得保证功能。

【讨论】：

尽管增加的 css 文件大小会下降，这对绕过下载文件的需要有很大帮助:)

IE中不是有2083个字符的url编码限制吗？大多数字体文件都会违反此限制。

【参考方案2】：

在 Windows 10 中，字体屏蔽分为三个级别：

下载字体的 IE 安全设​​置（用户部分） 选项“不受信任的字体阻止”（计算机级别） 选项“启用前端提供程序”（计算机级别）

您必须启用所有功能才能使其正常工作。

【参考方案3】：

对我来说，这个问题是由称为 Untrusted Font Blocking 的 Windows 10 功能引起的。我的办公室网络在我们的组策略设置中启用了此功能。

使用此功能，您可以启用全局设置，阻止用户加载由图形设备接口 (GDI) 处理的不受信任的字体。不受信任的字体是安装在 %windir%/Fonts 目录之外的任何字体。 https://support.microsoft.com/en-us/kb/3053676

使用组策略禁用不受信任的字体阻止：

打开组策略管理编辑器 在本地计算机策略下，展开计算机配置、管理模板、系统，然后单击缓解选项。 在不受信任的字体阻止设置中选择不阻止不受信任的字体

使用注册表编辑器禁用不受信任的字体阻止：

打开注册表编辑器 (regedit.exe) 并转到以下注册表子项： HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Session Manager\Kernel\ 如果 MitigationOptions 键不存在，请右键单击并添加一个新的 QWORD（64 位）值，将其命名为 MitigationOptions。 关闭此功能。输入 2000000000000。

重要提示：需要重新启动计算机才能使更改生效

【讨论】：

我不得不使用注册表设置。没有其他工作。

如何解决使用组策略启用不受信任的字体阻止时字体图标无法加载的问题：

【参考方案4】：

我在许多 Windows 10 / IE 11 机器上都有这个确切的问题（即 web 字体不起作用并在调试控制台中给出 CSS3111 错误）。在所有情况下，防火墙都已开启（并由组策略管理）。

我发现在注册表中禁用防火墙 HKLM\SYSTEM\CurrentControlSet\Services\SharedAccess\Parameters\FirewallPolicy\DomainProfile\EnableFirewall = 0 然后重新启动，然后将其设置回 1 并再次重新启动可以解决问题。

另一件总能解决问题的方法是在 Windows 功能中取消选择“Internet Explorer”，重新启动，然后重新选择“Internet Explorer”并再次重新启动。

我的猜测是这是某种类型的内部 Windows 防火墙错误，以上两个操作都会触发防火墙服务来清理某种类型的内部损坏。

【参考方案5】：

虽然听起来很奇怪，但解决方案是打开 Windows 防火墙。关闭防火墙后，您甚至无法将 TTF 字体添加到系统中，这与 @font-face 的问题相同。我在这里找到了解决方案：https://superuser.com/questions/957907/unable-to-install-fonts-on-windows-10

【讨论】：

不幸的是，我不确定这是否是我遇到问题的原因。三个 Windows 防火墙配置文件设置为关闭，并且服务本身已停止，但现在我突然可以在 IE 11 中看到字体。我检查了版本号，也一样。

对我来说，FW 关闭可靠是 Web 字体使用 CSS3111 的原因。我注意到，一旦系统（在 FW 开启时）看到一种字体，当 FW 再次关闭时，该特定字体在没有 CSS3111 的情况下继续工作。可能值得一试。