Why Can\'t IE Load EOT Fonts Over HTTPS?

Resolving @font-face EOT Font Loading Failures over HTTPS in IE

Internet Explorer users may encounter issues loading EOT fonts over HTTPS connections using the @font-face rule. While the font may load successfully over HTTP, switching to HTTPS may result in failure.

Investigation:

The issue stems from IE's handling of HTTPS requests. When a font is loaded over HTTPS and the server sends a Cache-Control: no-cache header, IE ignores the downloaded font. This is related to IE's behavior described in KB 815313, which prevents caching of active documents downloaded over SSL.

Solution:

To resolve this issue, ensure that the server hosting the font is not sending a Cache-Control: no-cache header. Removing or modifying this header will allow IE to recognize the downloaded font.

Example:

@font-face {
  font-family: 'GothamCondensedBold';
  src:url('path/to/fontgothmbcd-webfont.eot');
  src:url('path/to/fontgothmbcd-webfont.eot?#iefix') format('embedded-opentype'),
      url('path/to/fontgothmbcd-webfont.woff') format('woff'),
      url('path/to/fontgothmbcd-webfont.ttf') format('truetype'),
      url('path/to/fontgothmbcd-webfont.svg#GothamCondensedBold') format('svg');
  font-weight: normal;
  font-style: normal;
}

By ensuring that the server does not send a Cache-Control: no-cache header, IE will correctly load the EOT font over HTTPS.

The above is the detailed content of Why Can\'t IE Load EOT Fonts Over HTTPS?. For more information, please follow other related articles on the PHP Chinese website!