我正在使用wkhtmltopdf 将HTML 文件转换为PDF 格式；它提供了令人惊讶的好结果，完全按照 WebKit 的方式呈现 PDF。
我使用Google Web Fonts 让用户可以自定义他们编辑的文档的外观，让他们可以在几种字体之间进行选择。它也可以在浏览器中完美运行。
问题是，当使用 wkhtmltopdf 将此类 HTML 文件转换为 PDF 时，我无法使用 Google 字体。我读到其他人也有同样的issue。
谁能帮我解决这个问题？
编辑：直接在 CSS 中声明 @font-face 也不起作用。
【问题讨论】：
标签： html css wkhtmltopdf google-font-api
要通过wkhtmltopdf 将HTML 转换为PDF，请尽量避免使用woff 字体。使用Google Web Fonts 的truetype 格式和base64 编码。
最近我尝试使用来自 Google Web Fonts 的 Google Web 字体。在浏览器中显示正确，但在将 HTML 转换为 PDF 后不显示。
在网上广泛搜索后，我终于找到了将字体编码为base64 格式的工具，还获得了@font-face 的CSS。
阅读解决方案here。
【讨论】：
一个简单的解决方案：对字体进行 Base64 编码并将其嵌入 CSS：
@font-face {
font-family: 'OpenSans';
src: url(data:font/truetype;charset=utf-8;base64,AAEAAAATAQA...
}
FontSquirrel 可以通过他们的Webfont Generator 的高级选项为您做到这一点；谷歌等字体可以编码with this tool。
我已经将此解决方案与pdfkit 和wicked_pdf 一起使用，它们通过wkhtmltopdf 工作，所以我认为这也应该与本机wkhtmltopdf 一起工作。
【讨论】：
wkhtmltopdf 版本 0.12.3 在 OSX 上运行时不会与自定义字体配合，但在我们的 Ubuntu 登台和生产服务器上似乎可以正常工作。
我遇到了同样的问题，并通过下载字体并使用此字体声明从我的 Web 服务器中的本地文件运行它来解决它：
@font-face {
font-family: 'PT Sans';
src: url( '/public/inc/fonts/PTS55F-webfont.eot');
src: url( '/public/inc/fonts/PTS55F-webfont.eot?#iefix') format('embedded-opentype'),
url( '/public/inc/fonts/PTS55F-webfont.woff') format('woff'),
url( '/public/inc/fonts/PTS55F-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
我在Font Squirrel 上找到了这种字体，但你的里程可能会有所不同。
我认为谷歌的字体会发生什么，它试图只加载它认为这个浏览器想要的格式，这对于 WebKit 来说是错误的（我相信）。但是wkhtmltopdf 不能在 PDF 中嵌入 woff 字体，因此默认为无衬线字体。通过声明所有这些，TrueType 字体被包括在内，这是 PDF 实际使用的。
此外，您需要在任何 font-family CSS 定义中定义要用作第一个字体的字体，否则 wkhtmltopdf 将忽略它。
【讨论】：
我刚刚测试了使用@importnotation 的工作原理：
<style>
@import 'https://fonts.googleapis.com/css?family=Montserrat';
</style>
我正在使用 django-wkhtmltopdf 2.0.3 版
更新：仍在 django-wkhtmltopdf 3.3.0 中工作
【讨论】：
我已经为此苦苦挣扎了大约两天，如果以上答案都不适合您，我的建议是：
在托管网络服务器的机器上安装字体 (ttf)，并在 css 中要求它，就像使用普通字体一样。
body{
font-family: 'Lato';
}
现在wkhtmltopdf应该可以包含字体了
【讨论】：
src: {{ public_path('fonts/noto-sans.regular.ttf') }};你是怎么导入的？
我一定尝试了无数种变体来完成这项工作（来自本地）。我正在尝试通过 WKHtmlToPdf 将 Open Sans Condensed 嵌入到 pdf 中。
我认为直接从谷歌下载并安装 Open Sans Condensed ttf 并安装它很重要。安装后重新启动以允许其他服务访问也很重要。我最初从 font-squirrel 下载了 ttf，condensed 在 windows/fonts 中被列为“Open Sans”，这是错误的，如果你看一下谷歌安装它被列为“Open Sans Condensed Light”，所以即使是谷歌的local('Open Sans Cond Light')脚本是错误的。
如前所述，您需要明确拉伸和重量，所以这对我有用：
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans');
}
@font-face {
font-family: 'Open Sans Condensed';
font-stretch:condensed;
font-style: normal;
font-weight: 300;
src: local('Open Sans Condensed Light');
}
@@font-face { font-family: 'Open Sans Condensed Bold'; font-stretch:condensed; font-style: normal; font-weight: 700; src: local('Open Sans Condensed'), local('Open Sans Condensed Bold');}
【讨论】：
就我而言，我只需要添加此选项
--javascript-delay 1000
Google 字体文本开始显示。
[wkhtmltopdf 0.12.4（带补丁的qt）]
【讨论】：
确保您没有在打印样式表中声明要打印的字体。
【讨论】：
以下内容对我有用。注意包含扩展字符集（如果需要）：
<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,600&display=swap&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese);
</style>
【讨论】：