ric*_*892 8 ruby unicode ruby-on-rails wkhtmltopdf wicked-pdf
我正在尝试使用wicked_pdf(版本1.1)和wkhtmltopdf-binary宝石从html页面创建pdf .我的html页面包含一个日历表情符号,无论我使用什么字体,它都能在浏览器中很好地显示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv='content-type' content='text/html; charset=utf-8' />
<style>
unicode {
font-family: 'OpenSansEmoji', sans-serif;
}
@font-face {
font-family: 'OpenSansEmoji';
src: url(data:font/truetype;charset=utf-8;base64,<-- encoded_font_base64_string-->) format('truetype');
}
</style>
</head>
<body>
<div><unicode>📅</unicode></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
但是,当我尝试使用WickedPdf.new.pdf_from_html_filerails控制台中gem 的方法生成PDF时,
File.open(File.expand_path('~/<--pdf_filename-->.pdf'), 'wb+') {|f| f.write WickedPdf.new.pdf_from_html_file('<--absolute_path_of_html_file-->')}
Run Code Online (Sandbox Code Playgroud)
我得到以下结果:
如您所见,第一个日历图标已正确显示,但是显示第二个字符,我们不知道它来自何处.
我已经通过UTF-8和UTF-16编码进行了调查,并且按照相关帖子stackoverflow_emoji_wkhtmltopdf的建议调查了代理对,并查看了这个问题wkhtmltopdf_git_issue,但仍然不能使这个角色消失!
如果您有任何线索,那就非常受欢迎了.
在此先感谢您的帮助!
编辑
根据Eric Duminil和petkov.np的评论,我可以确认 - 上面的代码在Linux上适用于我.这似乎是Linux vs MacOS问题.任何人都可以建议MacOS绑定中的核心问题以及是否可以修复它?
我已经多次编辑了这个答案,请参阅最后的注释以及评论。
我使用的是 macOS 10.12.2 并且遇到了同样的问题。我列出了所有浏览器等版本,尽管我怀疑最大的因素是 OS/wkhtmltopdf 版本。
我正在使用以下示例片段:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<style type="text/css">
p {
font-family: 'EmojiSymbols', sans-serif;
}
@font-face {
font-family: 'EmojiSymbols';
src: local('EmojiSymbols-Regular.woff'), url('EmojiSymbols-Regular.woff') format('woff');
}
span:before {
content: '\01F60B';
}
</style>
</head>
<body>
<p>
<span></span>
😋
😋
😋
</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我打电话时wkhtmltopdf有这个--encoding 'UTF-8'选项。
您可以在此处查看渲染结果(对于蹩脚的屏幕截图,我深表歉意)。一些简短的结论:
wkhtmltopdf可以正常渲染原始字节,但不能content正确渲染 CSS 属性。每个“正确”出现的 unicode 符号后面都会跟着这个奇怪的幻像符号。我已经尝试了几乎所有的方法,但结果都是一样的。对我来说,即使 Safari 也无法正确渲染原始字节,这一事实表明存在 macOS 特定的系统级问题。我不清楚这是否应该被报告为一个wkhtmltopdf问题,或者 macOS 构建中存在一些行为不当的依赖项。
编辑: Safari 似乎工作正常,我的标记被破坏了。
编辑:解决方法CSS可能会解决问题,请检查下面的评论。
最终编辑:如评论中所示,解决问题的 CSS“hack”正在使用text-rendering: optimizeLegibility;. 这似乎只在 macOS/OS X 上需要。
从我下面的评论来看:
我刚刚发现这个问题。乍一看似乎无关紧要,但添加了text-rendering:optimizeLegibility; 我的样式删除了重复的字符(在 macOS 上)。为什么会发生这种情况超出了我的范围。由于问题作者也使用 osx,因此显然该操作系统的 wkhtmltopdf 构建存在一些问题。