IE 11 "sometimes" 阻止显示 "font-awesome" 网络字体
IE 11 "sometimes" preventing the display of "font-awesome" webfonts
我们的一些 IE11 客户端在我们的网络应用程序中看不到 "font-awesome" 网络字体。我已经使用我们自己的 IE11 实例以及跨浏览器测试工具进行了广泛的测试。全部正确执行。所以我很难理解为什么某些 IE11 设置可能看不到 "Font-Awesome" 网络字体?我确实尝试更改安全设置以重现该问题,但没有成功。
所以我正在就可能导致此问题的原因寻求一些建议?我唯一能想到的另一件事是,如果 IE 正在通过 Citrix 等共享服务器提供服务。
提前致谢。
EDIT1
更多证据:
Desktop1 S/W Firewall(on/off) Windows 7 IE V11.0.9600.17959 Office Errors
Laptop1 No S/W Firewall Windows 7 IE V11.0.9600.17959 Office OK
Laptop1 No S/W Firewall Windows 7 IE V11.0.9600.17959 Home OK
Azure VM ?? S/W Firewall Windows 10 IE V11 via Edge Azure OK
Azure VM ?? S/W Firewall Windows 10 Edge Azure OK
Laptop2 ?? S/W Firewall Windows 10 Edge Home Errors
更多证据 2
当我第一次进入页面时,图标显示。当用户从超链接重新进入页面时,图标不会显示。但是 ctrl-F5 对其进行排序。
更多证据 3
我还看到 Ajax 链接到可点击字体的链接请求被禁用。
更多证据 4
当我将我的站点添加到 "Restricted" 时,我什至无法登录,所以我不认为这是原因。
找到问题的原因。
我的问题是由
的 IE 浏览器历史记录设置引起并修复的
Cog
- Internet Options
- General
- Browsing History
- Settings
- Temporary Internet Files
- Automatic (will cause issue)
- Every time I visit the webpage (will fix issue)
下面的答案仍然会导致问题,但不是我的原因
找到我的问题的原因,但不适用于 HTTPS
刚刚发现,如果我尝试通过 Cloudflare 实施 HTTPS,问题就自己解决了....
IE 安全设置
我注意到 "Restricted Sites" 中的网站(在 Internet Explorer 中)不显示字体很棒 而"trusted sites"区做。
所以我猜问题出在不同用户的不同 IE 安全设置上。
您能否要求用户检查/更改他们在 IE 中的选项,例如(IE 11 的说明,但其他的将非常相似):
- 设置齿轮(右上角的图标)
- Internet 选项(菜单选项)
- 安全(选项卡)
- 站点(按钮)
- 输入您网站的网址
- 单击添加(按钮)
N.B。如果您不使用 https,您可能还需要选项
- "Require server verification (https:) for all sites in this zone" -
被取消选择
请求用户进行这些更改,然后从那里进行故障排除。
要调试的 Fiddler
如果您可以访问任何用户的机器,可以远程访问,或者有任何您可以指导的高级用户,那么也可以尝试在他们的机器上使用出色的 Fiddler http 代理进行调试,看看有什么发生在 http 请求/响应级别。
您也可以更改自己的 IE 安全设置,看看是否可以重现该问题
- 齿轮
- 互联网选项
- 安全
- 自定义级别
- 下载 -> 字体下载 -> 启用。
就我而言,我只有在使用 Win 10 + IE 11 时才会看到此问题。即使确保正确的 IE 设置(启用安全区域和字体下载),字体也不会呈现。貌似不应该为字体设置缓存头。
我们正在使用 Spring MVC 和 Tomcat。在 CORS 过滤器中添加以下代码为我解决了问题。
if (!request.getServletPath().endsWith(".woff")
&& !request.getServletPath().endsWith(".ttf")) {
response.setHeader("Cache-Control", "no-cache");
response.setHeader("Pragma", "no-cache");
response.setDateHeader("Expires", -1);
}
如果您出于 DISA STIG 安全原因无法启用可下载字体 try this solution that shows you how to Base 64 a font 并将其用作 CSS 文件来推送字体。
从下载字体的端点中的响应 header 中删除 Pragma Header 为我解决了。
if (request.getServletPath().contains(".woff") || request.getServletPath().contains(".ttf")) {
headers.remove(HttpHeaders.PRAGMA);
}
我们的一些 IE11 客户端在我们的网络应用程序中看不到 "font-awesome" 网络字体。我已经使用我们自己的 IE11 实例以及跨浏览器测试工具进行了广泛的测试。全部正确执行。所以我很难理解为什么某些 IE11 设置可能看不到 "Font-Awesome" 网络字体?我确实尝试更改安全设置以重现该问题,但没有成功。
所以我正在就可能导致此问题的原因寻求一些建议?我唯一能想到的另一件事是,如果 IE 正在通过 Citrix 等共享服务器提供服务。
提前致谢。
EDIT1
更多证据:
Desktop1 S/W Firewall(on/off) Windows 7 IE V11.0.9600.17959 Office Errors
Laptop1 No S/W Firewall Windows 7 IE V11.0.9600.17959 Office OK
Laptop1 No S/W Firewall Windows 7 IE V11.0.9600.17959 Home OK
Azure VM ?? S/W Firewall Windows 10 IE V11 via Edge Azure OK
Azure VM ?? S/W Firewall Windows 10 Edge Azure OK
Laptop2 ?? S/W Firewall Windows 10 Edge Home Errors
更多证据 2
当我第一次进入页面时,图标显示。当用户从超链接重新进入页面时,图标不会显示。但是 ctrl-F5 对其进行排序。
更多证据 3
我还看到 Ajax 链接到可点击字体的链接请求被禁用。
更多证据 4
当我将我的站点添加到 "Restricted" 时,我什至无法登录,所以我不认为这是原因。
找到问题的原因。
我的问题是由
的 IE 浏览器历史记录设置引起并修复的Cog
- Internet Options
- General
- Browsing History
- Settings
- Temporary Internet Files
- Automatic (will cause issue)
- Every time I visit the webpage (will fix issue)
下面的答案仍然会导致问题,但不是我的原因
找到我的问题的原因,但不适用于 HTTPS
刚刚发现,如果我尝试通过 Cloudflare 实施 HTTPS,问题就自己解决了....
IE 安全设置
我注意到 "Restricted Sites" 中的网站(在 Internet Explorer 中)不显示字体很棒 而"trusted sites"区做。
所以我猜问题出在不同用户的不同 IE 安全设置上。
您能否要求用户检查/更改他们在 IE 中的选项,例如(IE 11 的说明,但其他的将非常相似):
- 设置齿轮(右上角的图标)
- Internet 选项(菜单选项)
- 安全(选项卡)
- 站点(按钮)
- 输入您网站的网址
- 单击添加(按钮)
N.B。如果您不使用 https,您可能还需要选项
- "Require server verification (https:) for all sites in this zone" - 被取消选择
请求用户进行这些更改,然后从那里进行故障排除。
要调试的 Fiddler
如果您可以访问任何用户的机器,可以远程访问,或者有任何您可以指导的高级用户,那么也可以尝试在他们的机器上使用出色的 Fiddler http 代理进行调试,看看有什么发生在 http 请求/响应级别。
您也可以更改自己的 IE 安全设置,看看是否可以重现该问题
- 齿轮
- 互联网选项
- 安全
- 自定义级别
- 下载 -> 字体下载 -> 启用。
就我而言,我只有在使用 Win 10 + IE 11 时才会看到此问题。即使确保正确的 IE 设置(启用安全区域和字体下载),字体也不会呈现。貌似不应该为字体设置缓存头。
我们正在使用 Spring MVC 和 Tomcat。在 CORS 过滤器中添加以下代码为我解决了问题。
if (!request.getServletPath().endsWith(".woff")
&& !request.getServletPath().endsWith(".ttf")) {
response.setHeader("Cache-Control", "no-cache");
response.setHeader("Pragma", "no-cache");
response.setDateHeader("Expires", -1);
}
如果您出于 DISA STIG 安全原因无法启用可下载字体 try this solution that shows you how to Base 64 a font 并将其用作 CSS 文件来推送字体。
从下载字体的端点中的响应 header 中删除 Pragma Header 为我解决了。
if (request.getServletPath().contains(".woff") || request.getServletPath().contains(".ttf")) {
headers.remove(HttpHeaders.PRAGMA);
}