CentOS7 Puppeteerを実行してスクリーンショット画像を作成する • Yurikago Blog

ChromeやChromiumを制御するライブラリであるPuppeteerを利用して、CentOS7環境でスクリーンショット画像を作成する方法をまとめました。

検証環境

CentOS 7
- Node.js 8系
- Puppeteer 1.11.0
- Chromium 618750

検証リポジトリ: https://github.com/cuavv/sandbox-puppeteer

Node.jsのインストール

% yum install -y gcc-c++ make
% curl -sL https://rpm.nodesource.com/setup_8.x | bash -
% yum install -y nodejs

2行目はcurlの実行結果を標準入力としてbashコマンドの引数に渡します。setup_8.xはシェルスクリプトなので、bashコマンドの引数に渡すことでスクリプトが実行されます。

参考: https://qiita.com/bami3/items/d67152d19aa8ac2d47de

Chromiumのインストール

% yum install -y unzip

% mkdir /home/chromium
% cd /home/chromium
% yum install -y git
% git clone https://github.com/scheib/chromium-latest-linux .
% ./update.sh

update.shで最新のChromiumのzipがダウンロードされます。unzipコマンドでzipを解凍したあとlatestディレクトリと解凍したディレクトリを紐付けるシンボリックリンクが作成されます。

参考: http://note.onichannn.net/archives/3178

Chromiumの周辺パッケージをインストール

% yum install -y pango.x86_64 libXcomposite.x86_64 libXcursor.x86_64 libXdamage.x86_64 libXext.x86_64 libXi.x86_64 libXtst.x86_64 cups-libs.x86_64 libXScrnSaver.x86_64 libXrandr.x86_64 GConf2.x86_64 alsa-lib.x86_64 atk.x86_64 gtk3.x86_64 ipa-gothic-fonts xorg-x11-fonts-100dpi xorg-x11-fonts-75dpi xorg-x11-utils xorg-x11-fonts-cyrillic xorg-x11-fonts-Type1 xorg-x11-fonts-misc

フォントファイルなど。Puppeteerでスクリーンショット画像を作成したとき日本語が文字化けせずに表示されます。

Puppeteerのインストール

% mkdir /home/src
% cd /home/src
% export PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true
% npm install -y puppeteer

実行ファイルを作成

const puppeteer = require('puppeteer')

;(async () => {
  const browser = await puppeteer.launch({
    executablePath: '/home/chromium/latest/chrome',
    args: ['--no-sandbox', '--disable-setuid-sandbox'],
  })
  const page = await browser.newPage()
  await page.goto('https://www.google.com')
  await page.screenshot({ path: 'out.png', fullPage: true })

  await browser.close()
})()

% node /home/src/index.js

index.jsを実行するとGoogleトップページのスクリーンショット画像（/home/src/out.png）が作成されます。

参考: https://qiita.com/horikeso/items/0bf9a78454b8124a6dfa