44
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Rails】wicked_pdf導入にあたってつまづいたところメモ

Last updated at Posted at 2015-07-04

wicked_pdfという、HTMLをPDFに変換してくれる便利gemがあるのですが、導入の際に「ローカルで出力されてもサーバ上だと出力されない!」「画像が表示されない!」というようなつまづきポイントがいくつかあったので、はまりどころメモ。

wkhtmltopdfのパス指定問題

まさかのインストール直後にはまりました。
はまったところはconfig/initializers/wicked_pdf.rb内に記載するwkhtmltopdfのパス指定。
wkhtmktopdfというのはHTMLをPDFに変換してくれるツールです。
wicked_pdfはwkhtmktopdfのラッパーなので、wkhtmktopdfもインストールする必要があります。
wkhtmktopdfのプロジェクトページはこちら

ひとまずwicked_pdfにある「Installation」の項目を見ながら進めます。
Gemfileに必要なGemを追加して、bundle install

gem 'wicket_pdf'
gem 'wkhtmltopdf-binary'

rails generate wicked_pdfでconfig/initializers配下にwicked_pdf.rbというファイルが生成されます。
Installationに従ってwicked_pdf.rbの中身を下記のように記述

config/initializers/wicked_pdf.rb
WickedPdf.config = {
  exe_path: '/usr/local/bin/wkhtmltopdf'
}

ローカルではこれでもOKでした。が、サーバ上で動かそうとしたところ、エラーで起動すらせず。
考えてみると当たり前ですが、サーバ上の同じ場所にwkhtmltopdfがないわけです。
そこで、こちら(Rails4 wicked_pdfでPDF出力 ※windows未対応/ayaketanのプログラミング勉強日記)を参考にして、以下のように書き換え。

config/initializers/wicked_pdf.rb
WickedPdf.config = {
  exe_path: "#{Gem.loaded_specs['wkhtmltopdf-binary'].full_gem_path}/bin/wkhtmltopdf"
}

これでひとまずPDF生成までできました。

フォントがちゃんと出力されない問題

環境が違うと、ローカルではさくさくと進んでも、サーバに上げるとはまるということは多々あります。
フォントもそのパターンで、サーバ上で生成すると日本語が出力されない状況に当たりました。
日本語が出力されないのは単純にフォントが入っていないからなので、IPAフォントを入れます。
それでも句読点の間隔が詰まっていたり、文字バランスがずれていたりでイマイチ。
別のフォントが必要そうということで、MigMixフォントを利用することにしました。1Pと2Pがありますが、今回は2Pを入れています。

# migmixフォントのzipをダウンロードして解凍
wget "http://jaist.dl.sourceforge.jp/mix-mplus-ipa/59021/migmix-2p-20130617.zip"
unzip migmix-2p-20130617.zip

# フォントを置いているところへ移動
sudo mv -i migmix-2p-20130617/*ttf /usr/share/fonts/japanese/TrueType/
ls /usr/share/fonts/japanese/TrueType/
  ipaexg.ttf  ipaexm.ttf  migmix-2p-bold.ttf  migmix-2p-regular.ttf

# 設定を反映させるためにフォントキャッシュをクリア
fc-cache -fv

# フォントが登録されていることを確認
fc-list | grep Mig
  MigMix 2P:style=Bold
  MigMix 2P:style=Regular

これでフォントもきれいに出力されました。

S3の画像が表示されない問題

(今更ながら)追記@2016/12/03

2016/7/14に更新されたバージョン0.12.3でこちらの問題は解消されたようです。
https://rubygems.org/gems/wkhtmltopdf-binary

なので、Gemfileでは以下のように

gem 'wicked_pdf'
gem 'wkhtmltopdf-binary'

config/initializers/wicked_pdf.rbでは以下のように記述して解決でした。

config/initializers/wicked_pdf.rb
WickedPdf.config = {
  :exe_path => "#{Gem.loaded_specs['wkhtmltopdf-binary'].full_gem_path}/bin/wkhtmltopdf"
}

※ 以下は追記前の古いバージョンでの対応になります

恐らく一番途方にくれたところ。
元々ちゃんと表示されていた画像が、途中からS3の画像のみ表示されなくなってしまったので余計「なんで!?」感が強かったです。

ググると、stackoverflow似たような質問が投げられています。(wicked pdf not displaying amazon s3 images
調べていくと、どうやら最初に入れたwkhtmltopdf-binaryはGemだと最新版ではないとのこと。
このときのバージョンは0.9.9.3。一方wkhtmltopdfプロジェクトを見ると、最新は0.12.2.1。
__全然違うじゃないか!__ということで、恐らく原因はこれと踏んで、最新版を入れ直すことに。
最新版に対応したGemがないかと探したところ、ありました、wkhtmltopdf-binary-edge
先ほどのGemfileを修正して、wkhtmltopdf-binaryをwkhtmltopdf-binary-edgeに変更してbundle install

gem 'wicket_pdf'
gem 'wkhtmltopdf-binary-edge', '~> 0.12.2.1'

あわせてwicked_pdf.rbも修正

config/initializers/wicked_pdf.rb
WickedPdf.config = {
  exe_path: "#{Gem.loaded_specs['wkhtmltopdf-binary-edge'].full_gem_path}/bin/wkhtmltopdf"
}

これできれいに表示された…!と思いきや、ローカルだけでした。
サーバ上で動かそうとすると、エラーの山。
何事かと思いきや、なにやらOSが合っていない模様。
サーバがAmazonLinuxだったのですが、wkhtmltopdf-binary-edgeが対応しているのはUbuntuとOS X。
AmazonLinuxは対応していません。確認ミスです。
AmazonLinuxに対応しているものもあるはず…と思って探してみると、ちゃんとありました、wkhtmltopdf-binary-aml
再度Gemfileとwicked_pdf.rbを修正

gem 'wicket_pdf'
gem 'wkhtmltopdf-binary-aml', git: 'https://github.com/insphire/wkhtmltopdf-binary-aml'
config/initializers/wicked_pdf.rb
WickedPdf.config = {
  exe_path: "#{Gem.loaded_specs['wkhtmltopdf-binary-aml'].full_gem_path}/bin/wkhtmltopdf"
}

これでローカル、サーバともにきれいにPDF出力ができました。

その他ちょっとしたレベルのつまづき

  • 変に改ページされてしまう問題
    • h2タグに色をつけていた場合、タグの下1/3が次ページになってしまうなど。
    • CSSのpage-break-insideを利用して解決
    • ex. h2タグでpage-break-inside: avoid;を指定
  • 任意のところで改ページしたい
    • CSSのpage-break-afterを利用
    • ex. bodyタグでpage-break-after: always;を指定
44
39
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
44
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?