html-pdf-chrome
- puppeteer ではない
- HTMLファイルではなくソースを渡した時にPDF変換したい
docker
docker run -it alpine ash
chromium フォント nodejs をインストール
apk add --update udev ttf-freefont chromium nodejs npm
必要があれば Google 日本語フォントのインストール
mkdir /noto
cd /noto
wget https://noto-website.storage.googleapis.com/pkgs/NotoSansCJKjp-hinted.zip
unzip NotoSansCJKjp-hinted.zip && mkdir -p /usr/share/fonts/noto && cp *.otf /usr/share/fonts/noto && chmod 644 -R /usr/share/fonts/noto/ && fc-cache -fv
cd /
Dockerを使ってHeadless Chromeを動かしてみる - Qiita
node module をインストール
npm install html-pdf-chrome
npm install -g pm2
pm2の起動
--headless --no-sandbox --disable-gpu を指定する
pm2 start chromium-browser --interpreter none -- --headless --no-sandbox --disable-gpu --disable-translate --disable-extensions --disable-background-networking --safebrowsing-disable-auto-update --disable-sync --metrics-recording-only --disable-default-apps --no-first-run --mute-audio --hide-scrollbars --remote-debugging-port=9222
...
┌────┬─────────────────────────┬─────────┬─────────┬──────────┬────────┬──────┬──────────┬──────────┬──────────┬──────────┬──────────┐
│ id │ name │ version │ mode │ pid │ uptime │ ↺ │ status │ cpu │ mem │ user │ watching │
├────┼─────────────────────────┼─────────┼─────────┼──────────┼────────┼──────┼──────────┼──────────┼──────────┼──────────┼──────────┤
│ 0 │ chromium-browser │ N/A │ fork │ 99 │ 0s │ 0 │ online │ 0% │ 2.0mb │ root │ disabled │
└────┴─────────────────────────┴─────────┴─────────┴──────────┴────────┴──────┴──────────┴──────────┴──────────┴──────────┴──────────┘
変換スクリプト
CSSもすべて詰め込んだHTML
const htmlPdf = require('html-pdf-chrome');
const html = `
<html>
<head>
<style>
@page {
margin: 0;
padding: 0;
size: 15in 11in;
}
</style>
</head>
<body>
<h1>HELLO!</h1>
</body>
</html>
`;
const options = {
port: 9222, // port Chrome is listening on
};
htmlPdf.create(html, options).then((pdf) => pdf.toFile('./example.pdf'));
htmlPdf.create(html, options).then((pdf) => pdf.toBase64());
htmlPdf.create(html, options).then((pdf) => pdf.toBuffer());
変換
node convert.js
local で確認
docker cp <DOCKER_CONTAINER_ID>:/example.pdf ./
open ./example.pdf
結果
CSS JS 対応状況は？
headless chrome を利用してるので、なんでもできるでしょ。
HTML から CSS JS ファイルを参照するには？
docker で http サーバーを立てて 外部参照可能な場所にファイルを置ければよいのかもしれないが、未調査。
pm2 が使える？使えない？ 使い方調査が必要だ。
AWS - Amazon Linux 環境の場合は
chrome binary をインストールするための universal な shell script がある
Installing Google Chrome On CentOS, Amazon Linux, or RHEL
Original by Github issue
チャットメンバー募集
何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。