Safari 用户安装的字体不呈现

Question

我使用的是 MAC OSX，我的 Safari 版本是 13.0.3。我尝试在我的机器中安装一些自定义字体。我在我的机器上安装了来自https://www.fontsquirrel.com/fonts/list/popular 的字体 great-vibes（只是一个示例），它现在显示在我的字体册中的用户字体部分下。我正在使用字体的 .otf 格式。我现在尝试在我的网络应用程序上使用它，如下所示：

@font-face {
  font-family: 'Great Vibes'; //Added postscript name as well, did not work
  font-style: normal;
  font-weight: 400;
  src: local('Great Vibes')
}
body {
  font-family: 'Great Vibes' !important;
}

这适用于 Chrome 和 Firefox（即使没有 @font-face）声明。但这不适用于 Safari。我试过像 -webkit-text-stroke: .5px; 这样的选项。文本渲染：优化易读性；但它不起作用。我尝试将不同的自定义字体安装到我的机器中，但它们也无法在 Safari 上运行。我看到字体已经正确安装了。

注意：在我的应用程序代码中保留自定义字体并使用 @font-face/src/url 效果很好。问题在于尝试访问计算机上的自定义安装字体时。

Answer 1

原因是 Safari 12/macOS Mojave 禁用了用户安装字体 to combat browser fingerprinting 的显示，这通过观察您的系统配置（包括您安装了哪些字体）来启用在线跟踪。通过仅渲染默认系统字体，当然还有其他任何可通过 Internet 访问的字体，您的计算机看起来更像其他任何字体，并且变得更难跟踪。

如果您想在 Safari 中使用非标准字体进行开发，您必须使用指向嵌入式或 Internet 托管字体的 @font-face/src/url 声明。或者，您可以禁用跟踪保护，但这可能不是一个好主意。

如果您在 Firefox 中激活了增强的跟踪保护，也可以阻止指纹识别，您应该会看到与 Safari 相同的行为。

来源：两个redditposts

Answer 2

您应该尝试Bulletproof @font-face Syntax，其中本地字体的基本语法如下所示：

@font-face {
font-family: 'Graublau Web';
src: url(GraublauWeb.eot);
src: local('Graublau Web Regular'), url(GraublauWeb.otf) format('opentype');
}