CircleCIでPuppeteerを定期実行する

概要

• PuppeteerをCircleCIで毎日決まった時間に実行するというものを作ったのでそのメモ

雛形作成

• サンプル用の雛形を作る

mkdir puppeteer-sample
cd puppeteer-sample
yarn init -y
# or
npm init -y

Puppeteerの導入

インストール

yarn add puppeteer
# or
npm i puppeteer

サンプルの作成

• 今回はPuppeteerのリポジトリにあるサンプルを使う
  • https://github.com/GoogleChrome/puppeteer/blob/master/examples/search.js
  • https://developers.google.com/web/の中からHeadless Chromeのタグがついた記事を抽出するというサンプル

sample.js

const puppeteer = require('puppeteer');

(async() => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  await page.goto('https://developers.google.com/web/');

  // Type into search box.
  await page.type('#searchbox input', 'Headless Chrome');

  // Wait for suggest overlay to appear and click "show all results".
  const allResultsSelector = '.devsite-suggest-all-results';
  await page.waitForSelector(allResultsSelector);
  await page.click(allResultsSelector);

  // Wait for the results page to load and display the results.
  const resultsSelector = '.gsc-results .gsc-thumbnail-inside a.gs-title';
  await page.waitForSelector(resultsSelector);

  // Extract the results from the page.
  const links = await page.evaluate(resultsSelector => {
    const anchors = Array.from(document.querySelectorAll(resultsSelector));
    return anchors.map(anchor => {
      const title = anchor.textContent.split('|')[0].trim();
      return `${title} - ${anchor.href}`;
    });
  }, resultsSelector);
  console.log(links.join('\n'));

  await browser.close();
})();

CircleCIの設定

• 設定ファイルを作成する
• 今回は6時間ごとに実行されるサンプル

.circleci/config.yml

version: 2
jobs:
  execute:
    docker:
      - image: circleci/node:latest-browsers
    steps:
      - checkout
      - run: yarn install
      - run: node sample.js
workflows:
  version: 2
  execute-workflow:
    triggers:
      - schedule:
          cron: '0 0,6,12,18 * * *' # UTC
          filters:
            branches:
              only:
                - master
    jobs:
      - execute

• dockerイメージにcircleci/node:latest-browsersを指定するとこれだけでPuppeteerが動いた
• scheduleにcronの設定で実行タイミングを指定できる
  • 0 */6 * * *のような書き方だとエラーになってしまって少しはまった

実行

• ソースコードをGithubにpushしてCircleCIと連携させる

• タイミングが来ると自動で起動される