Puppeteer를 Docker 컨테이너에서 사용

웹 사이트의 스크린 샷을 찍는 CLI 도구 site-checker를 만들었습니다.

설치 방법을 쓰고 있어, 「Node.js의 vX.X.X 이상을 인스톨 해 주세요」라고 하는 것도 오늘적이지 않다고 느끼고, 실행 환경의 버젼을 신경쓰지 않고 이용할 수 있도록 Docker 이미지도 준비했다 . 그 때, 조금 걸린 것을 쓴다.

사용 버전

Puppeteer v0.10.2

Node.js v8.4.0 공식 Docker 이미지

Dockerfile 만들기

마지막으로 만든 Dockerfile은 다음과 같습니다.

FROM node:8.4
MAINTAINER HeRoMo

RUN echo 'deb http://ftp.jp.debian.org/debian jessie-backports main' >> /etc/apt/sources.list
RUN set -ex; \
        apt-get update; \
        apt-get install -y --no-install-recommends \
                gconf-service \
                libasound2 \
                libatk1.0-0 \
                libc6 \
                libcairo2 \
                libcups2 \
                libdbus-1-3 \
                libexpat1 \
                libfontconfig1 \
                libgcc1 \
                libgconf-2-4 \
                libgdk-pixbuf2.0-0 \
                libglib2.0-0 \
                libgtk-3-0 \
                libnspr4 \
                libpango-1.0-0 \
                libpangocairo-1.0-0 \
                libstdc++6 \
                libx11-6 \
                libx11-xcb1 \
                libxcb1 \
                libxcomposite1 \
                libxcursor1 \
                libxdamage1 \
                libxext6 \
                libxfixes3 \
                libxi6 \
                libxrandr2 \
                libxrender1 \
                libxss1 \
                libxtst6 \
                ca-certificates \
                fonts-liberation \
                libappindicator1 \
                libnss3 \
                lsb-release \
                xdg-utils \
                wget \
                fonts-noto-cjk

RUN yarn global add site-checker

RUN mkdir -p /output
WORKDIR /output
ENV NO_SANDBOX=true
ENTRYPOINT [ "site-checker" ]
CMD [ "-h" ]

이 내용이 되기 전에 다음의 3점의 문제가 발생했다.

Puppeteer 설치 중 오류 발생

Chrome을 시작할 수 없음

일본어 문자가 깨진다

이들에 대해서는 이하에 설명한다.

Puppeteer 설치 중 오류 발생

Puppeteer 리포지토리의 t루b〇쇼정정g. MD에 종속 패키지 목록이 있으므로 apt-get 설치하십시오. 그리고, RUN npm install -g site-checker 하면 좋다고 생각했지만, 여기서 다음과 같은 에러가 발생했다.

> [email protected] install /usr/local/lib/node_modules/site-checker/node_modules/puppeteer
> node install.js

fs.js:891
  return binding.mkdir(pathModule._makeLong(path),
                 ^

Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/site-checker/node_modules/puppeteer/.local-chromium'
    at Object.fs.mkdirSync (fs.js:891:18)
    at Object.downloadRevision (/usr/local/lib/node_modules/site-checker/node_modules/puppeteer/utils/ChromiumDownloader.js:97:10)
    at Object.<anonymous> (/usr/local/lib/node_modules/site-checker/node_modules/puppeteer/install.js:33:12)
    at Module._compile (module.js:573:30)

    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Function.Module.runMain (module.js:609:10)
    at startup (bootstrap_node.js:158:16)
npm info lifecycle [email protected]~install: Failed to exec install script
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: `node install.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm install가 좋지 않으면 RUN yarn global add site-checker로 시도하려고하면 설치에 성공했습니다.

Chrome을 시작할 수 없음

이미지의 빌드에는 성공해, 다음과 같이 실행했다.

docker run --rm -v $(pwd):/output:rw site-checker -u http://qiita.com/

그러면 다음과 같은 오류가 발생했습니다.

Error: Failed to launch chrome!
[0907/150437.316459:ERROR:zygote_host_impl_linux.cc(88)] Running as root without --no-sandbox is not supported. See https://crbug.com/638180.



TROUBLESHOOTING: https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md

    at Interface.onClose (/usr/local/share/.config/yarn/global/node_modules/puppeteer/lib/Launcher.js:142:14)
    at emitNone (events.js:110:20)
    at Interface.emit (events.js:207:7)
    at Interface.close (readline.js:367:8)
    at Socket.onend (readline.js:147:10)
    at emitNone (events.js:110:20)
    at Socket.emit (events.js:207:7)
    at endReadableNT (_stream_readable.js:1059:12)
    at _combinedTickCallback (internal/process/next_tick.js:138:11)
    at process._tickCallback (internal/process/next_tick.js:180:9)

"Running as root without --no-sandbox is not supported."라고 써 있으므로, root가 아닌 사용자로 실행해 보았지만, 그래도 에러가 발생한다.

t루bぇ쇼정정g. MD 를 보라라고 표시되어 있으므로 참조하면, 「try running without the sandbox」라고 쓰고 있으므로, 따르기로 한다.
Chrome을 시작할 때 다음과 같이 인수를 주면 좋다.

const browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-setuid-sandbox']});

t루bぇ쇼정정g. MD 에는 --no-sandbox 로의 실행은 시큐리티적으로 추천하지 않는다고 쓰여져 있지만, Docker 컨테이너안이므로 나누기로 했다.

환경 변수 NO_SANDBOX로 전환할 수 있도록 툴의 구현을 변경해 대응했다.

일본어 문자가 깨진다.

어떻게든 움직이게 되었지만, 일본어 사이트의 스크린 캡쳐를 취하면 다음과 같이 일본어를 표시할 수 없었다.



일본어를 표시할 수 있는 폰트가 이미지에 인스톨 되어 있지 않기 때문이라고 생각하고, Google Noto Fonts 의 인스톨을 추가했다.

Node의 공식 이미지 OS인 debian jessie의 패키지 리포지토리에는 없기 때문에, 다음과 같이 리포지토리를 추가해 apt-get로 인스톨 했다.

RUN echo 'deb http://ftp.jp.debian.org/debian jessie-backports main' >> /etc/apt/sources.list

그러자 다음과 같이 훌륭하게 표시되게 되었다.