带有 wicked_pdf 生成器的 Base64 @font-face 字体答案

【问题标题】：Base64 @font-face Font with wicked_pdf Generator带有 wicked_pdf 生成器的 Base64 @font-face 字体
【发布时间】：2014-02-08 21:29:10
【问题描述】：

我正在尝试在 Rails 3 站点上使用 wicked_pdf 在 HTML 到 PDF 生成的 PDF 文件中使用特定字体。我在这里找到了我遵循的其他建议。（主要）对我有用的唯一一件事是将字体转换为base64。我在这里找到了原始答案： Wicked PDF +fonts+heroku+rails3.2

我必须将@font-face CSS 直接放入正在使用它的部分文件中，而不是将其放入样式表中以使其工作。它现在在我的本地副本中运行良好。当我将它部署到我们的登台服务器时，它只工作了一半。加载了其中一种字体，但未加载字体的粗体版本。

这是我在部分中包含的@font-face CSS（this pastebin 包含整个 Base64 代码，但很有用）：

<style type="text/css">
  @font-face {
    font-family: 'MuseoSans300';
    src: url(data:font/truetype;charset=utf-8;base64,AAEAAAATAQAABAA...excess text removed);
  }
  @font-face {
    font-family:'MuseoSans700';
    src: url(data:font/truetype;charset=utf-8;base64,AAEAAAATAQAABAA...excess text removed);
  }
</style>

使用这些字体的常规样式表（使用 SASS）中的样式如下所示：

#profile_pdf {
  font-family: 'MuseoSans300';
  h1 {
    font-size: 30px;
    font-family: 'MuseoSans700';
  }
  h2 {
    font-size: 20px;
    font-family: 'MuseoSans300';
  }
}

我尝试过多种方式来改变它。我使用了与此建议相同的格式： http://blog.shahariaazam.com/use-google-web-fonts-for-wkhtmltopdf-tools/#.UtwZUmQo5hE

这使它完全停止工作。

使用我上面显示的格式，它确实适用于我本地运行的副本。在登台服务器上，只有一种字体有效；它仅在 300 版本中加载所有内容，而 700 版本不加载。有没有其他人遇到过这个问题？

【问题讨论】：

您的开发和登台环境有什么不同？意思是......如果它在开发中工作，你可能已经正确设置了一切。也许登台环境只需要一些调整。
我也遇到了同样的问题，你在 Heroku 上的 staging env 是否有机会？
我认为这与资产的预编译有关。如果您在本地预编译，您会复制暂存问题吗？它对我有用。
它可以在本地主机上运行吗？

标签： ruby-on-rails base64 font-face wicked-pdf

【解决方案1】：

我在使用 Wicked PDF 时遇到了类似的问题。我解决它的方法是定义一个字体系列，其中包含我想要定位的每个重量。看起来像这样：

@font-face {
  font-family: 'Karla';
  font-weight: 400;
  font-style: normal;
  src: ...;
}

@font-face {
  font-family: 'Karla-Bold';
  font-weight: 700;
  font-style: bold;
  src: ...;
}

我相信您需要明确指定字体粗细数字才能使其正确显示粗体版本。我的问题与您的问题相同，这为我解决了。

【讨论】：

字体样式：粗体； - 真的吗？

【解决方案2】：

我认为在 url 部分，如果您将它们放在资产下，它应该是 /assets/..... 而不是 /font，因为 Rails 会将所有内容编译成资产

【讨论】：