Zenn
🖥

HTML to PDF 変換コマンド・ライブラリの比較 : 結論 headless Chrome の直接利用が最強では？ ( #HTML #

2019/10/30に公開
Chrome
HTML
Node.js
PDF
tech

環境

Mac

Web: 変換元

https://yahoo.com を変換してみる。

image
image

Chrome の headless モード

OSのGoogleChromeを直接利用する。

ヘッドレス Chrome ことはじめ
https://developers.google.com/web/updates/2017/04/headless-chrome

alias chrome="/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome"

chrome --headless --disable-gpu --print-to-pdf https://www.yahoo.com

open output.pdf

image

完璧じゃないか！

なんかエラーは出たけども。

$ chrome --headless --disable-gpu --print-to-pdf https://www.yahoo.com
[1030/134817.172348:ERROR:xattr.cc(63)] setxattr org.chromium.crashpad.database.initialized on file /var/folders/nt/brt3bhdn50v57vqgz5t6xqc40000gn/T/: Operation not permitted (1)
[1030/134817.173787:ERROR:file_io.cc(89)] ReadExactly: expected 8, observed 0
[1030/134817.176145:ERROR:xattr.cc(63)] setxattr org.chromium.crashpad.database.initialized on file /var/folders/nt/brt3bhdn50v57vqgz5t6xqc40000gn/T/: Operation not permitted (1)
[1030/134823.138892:INFO:headless_shell.cc(620)] Written to file output.pdf.```

node chrome-headless-render-pdf

npm install -g chrome-headless-render-pdf

chrome-headless-render-pdf --url https://yahoo.com --pdf ./yahoo-chrome-headless-render.pdf && open ./yahoo-chrome-headless-render.pdf

$ chrome-headless-render-pdf --url https://yahoo.com --pdf ./yahoo-chrome-headless-render.pdf && open ./yahoo-chrome-headless-render.pdf
Using /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
Waiting for chrome to became available
Chrome port open!
Chrome port open!
Chrome port open!
Chrome port open!
Chrome port open!
Connected to HeadlessChrome/78.0.3904.70, protocol 1.3
Opening https://yahoo.com
Wait for load took 4543ms
Wait for js execution took 1785ms
Wait for animations took 105ms
Saved ./yahoo-chrome-headless-render.pdf

image

chrome を使っているはずなのに何故かヘッダが白い。

node html-pdf

サポート終了している phantomjs を使っている
URLを直接指定できないのでlocalにいちどダウンロードしてから試した
ページを解析する最中のjsエラーか何かでエラーで落ちた
別件で変換成功したケースはあるが、CSSの扱いが古かったりでレイアウトに苦労した

npm install -g html-pdf

$ html-pdf ~/Downloads/Yahoo.htm ~/yahoo.html-pdf.pdf
fs.js:114
    throw err;
    ^

Error: ENOENT: no such file or directory, open '/Users/yumainaura/Downloads/Yahoo.htm'
    at Object.openSync (fs.js:443:3)
    at Object.readFileSync (fs.js:343:35)
    at htmlpdf (/usr/local/lib/node_modules/html-pdf/bin/index.js:25:17)
    at Object.<anonymous> (/usr/local/lib/node_modules/html-pdf/bin/index.js:10:3)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:829:12)

Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2638

チャットメンバー募集

何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ

Twitter

https://twitter.com/YumaInaura

公開日時

2019-10-30

Discussion