WickedPDF 本地渲染与生产渲染不同

Question

我已经在我的台式机上安装了 wkhtmltopdf 0.12.3（带有补丁的 qt），在我的 Centos 虚拟机上安装了完全相同的版本。

我正在使用 WickedPDF 和 Rails 将 HTML 转换为 PDF。

生成 PDF 时，其字体略有不同。一些奇怪的字母间距。我已附上显示此内容的图片。

您可以看到 e 和 n 之间的差距，但这在我的本地计算机上不存在。下图：

有人知道为什么会这样吗？

任何建议将不胜感激。

谢谢

这是我用来通过 WickedPDF 生成 PDF 的 Ruby 代码

def generate_pdf
    pdf = WickedPdf.new

    pdf_file = pdf.pdf_from_string(ActionController::Base.new().render_to_string('card_requests/show.pdf.haml', layout: 'pdf', locals: {card_request: self}),
      dpi: '300',
      margin: {top: 0, bottom: 0, left: 0, right: 0},
      page_height: '2.25in',
      page_width: '3.75in',
      disable_smart_shrinking: false
    )

    tempfile = Tempfile.new(["#{self.name.gsub(' ', '_').downcase}_biz_card", '.pdf'], Rails.root.join('pdfs'))
    tempfile.binmode
    tempfile.write pdf_file
    tempfile.close

    self.pdf = File.open(tempfile.path)
    tempfile.unlink

    self.save

  end

这也是顶部带有 CSS 的 show.pdf.haml 文件：

!!! 5
%html
  %head
    :css
      html * {
        margin: 0 !important;
        padding: 0 !important;
        page-break-inside: avoid !important;
      }
      body {
        margin: 0 !important;
        padding: 0 !important;
        page-break-inside: avoid !important;
        text-rendering: optimize-speed;
      }
      .card-preview {
        font-family: 'TradeGothic';

        background-size: contain;
        width: 369px;
        height: 220px;
        page-break-after: avoid !important;
        position: relative;
      }

      #card-name {
        color: #ED1D27;
        font-weight: bold;
        font-size: 12pt;
        position: absolute;
        top: 37px;
        left: 39px;
        width: 328px;
      }

      #card-title {
        color: #2E2D2D;
        font-weight: bold;
        position: absolute;
        top: 54px;
        left: 39px;
        font-size: 9pt;
      }

      #card-office-phone {
        color: #4e4e48;
        position: absolute;
        top: 148px;
        left: 39px;
        font-size: 8.5pt;
      }

      #card-cell-phone {
        color: #4e4e48;
        position: absolute;
        top: 135px;
        left: 39px;
        font-size: 8pt;
        width: 200px;
      }

      #card-email {
        color: #4e4e48;
        position: absolute;
        top: 161px;
        left: 39px;
        font-size: 8.5pt;
      }

      #card-website {
        color: #4e4e48;
        position: absolute;
        top: 174px;
        left: 39px;
        font-size: 8pt;
      }
      .hide {
        display: none;
      }
    %meta{:charset => "utf-8"}
  %body
    .card-preview{style: "background-image: url('#{Rails.root.join('app', 'assets', 'images', 'card_template_2.svg')}')"}
      #card-name
        = card_request.name
      #card-title
        = card_request.title
      #card-office-phone{class: (card_request.office? ? "" : 'hide')}
        == office 555 555 5555 #{card_request.ext? ? "ext #{card_request.ext_phone}" : ''}
      #card-cell-phone{class: ((card_request.cell? && !card_request.cell_phone.blank?) ? "" : 'hide'), style: (card_request.office? ? "" : 'top: 148px; left: 39px;')}
        = (card_request.cell? ? "cell 555 555 5555" : '')
      #card-email
        = card_request.email
      #card-website
        www.website.com

我已经通过以下方式解决了这个问题：

https://taskman.eionet.europa.eu/issues/20890

它为我修复了 CentOS 上的字距调整问题。

Answer 1

在某些特定字母（如

）之后，我遇到了类似的空格问题

Reg istration  ---> space after letter 'g'

O pen   ---> space after Capital letter 'O'

上述问题可能是由于系统特定的字体配置造成的。我提到了一个通过 github 报告的相同 https://github.com/wkhtmltopdf/wkhtmltopdf/issues/45 的问题

此问题发生在使用 CentOS 6.x 的生产实例（AWS AMI linux）上，但在 ubuntu 14.04 上运行良好。我在路径 /etc/fonts/conf.d 上查看了 CentOS 上的系统字体配置 51-local.conf。如果在同一路径中没有名为 wkhtmltopdf 的文件，则使用默认字体文件 51-local.conf以下配置为自定义字体。

<?xml version='1.0'?>
<!DOCTYPE fontconfig SYSTEM 'fonts.dtd'>
<fontconfig>
 <match target="font">
  <edit mode="assign" name="rgba">
   <const>rgb</const>
  </edit>
 </match>
 <match target="font">
  <edit mode="assign" name="hinting">
   <bool>true</bool>
  </edit>
 </match>
 <match target="font">
  <edit mode="assign" name="hintstyle">
   <const>hintslight</const>
  </edit>
 </match>
 <match target="font">
  <edit mode="assign" name="antialias">
   <bool>true</bool>
  </edit>
 </match>
 <match target="font">
  <edit mode="assign" name="lcdfilter">
   <const>lcddefault</const>
  </edit>
 </match>
</fontconfig>

另外，如果您使用 wicked_pdf.rb 初始化程序配置执行路径作为 /usr/local/bin/wkhtmltopdf 用于开发环境。尝试将路径替换为 /bin/wkhtmltopdf 用于生产包