PuppeteerでCookieを利用する

はじめに

Puppeteerでログインが必要なWebサイトにアクセスしたい時、Cookieを利用する方法について説明します。
昨今は2段階認証が当たり前で、メール認証であればGmail APIと組み合わせて頑張ればPuppeteerからでも全自動でログイン可能ですが、実装の手間がありますし、それ以外の認証方法だと厳しいし、ということでCookieを使ってしまおうという流れです。

Cookieの取得

Chrome拡張機能で簡単にCookie情報が取得できるので、それを活用します。
CookieをダウンロードできるChrome拡張機能はいくつかストアで公開されていますが、以下の事例のようなセキュリティ的な懸念もあるので自分で書いてしまいましょう。
https://qiita.com/rana_kualu/items/e50e33bbde229882da8d

以下のような実装で、簡単にCookieを取得することが可能です。

// "domain"で指定したドメインに該当するクッキーを取得
const cookies = await chrome.cookies.getAll({ domain });

// Puppeteer形式への変換処理
// PuppeteerのsetCookie形式: [{name, value, domain, path, expires, httpOnly, secure, sameSite}, ...]
const puppeteerCookies = cookies.map(c => {
  return {
    name: c.name,
    value: c.value,
    domain: c.domain,
    path: c.path,
    expires: c.expirationDate ? Math.floor(c.expirationDate) : 0,
    httpOnly: c.httpOnly,
    secure: c.secure,
    sameSite: c.sameSite === 'no_restriction' ? 'None' : 
              c.sameSite === 'lax' ? 'Lax' : 
              c.sameSite === 'strict' ? 'Strict' : 'None' 
  };
});

ダウンロード部分の実装

// JSON生成
const jsonStr = JSON.stringify(puppeteerCookies, null, 2);
const blob = new Blob([jsonStr], { type: 'application/json' });
const url = URL.createObjectURL(blob);

// ダウンロード用リンクを作成し、自動でクリック
const downloadLink = document.createElement('a');
downloadLink.href = url;
downloadLink.download = `${domain}_cookies.json`;
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);
URL.revokeObjectURL(url);

自作したChrome拡張機能を公開しています
https://github.com/ryotakurashiki/CookieExporter

Chrome拡張の公式ドキュメント
https://developer.chrome.com/docs/extensions/reference/api/cookies?hl=ja#method-get

Puppeteerでの利用

const cookies = JSON.parse(fs.readFileSync('./cookies.json', 'utf-8'));
const browser = await puppeteer.launch();
await browser.setCookie(...cookies);

Puppeteerの公式ドキュメント
https://pptr.dev/guides/cookies

おわりに

この方法で、ログインが必要なWebサイトにもPuppeteerからアクセスが可能になります。
当たり前ですがCookie情報にはセキュリティ上重要な情報が含まれているので、取り扱いには注意しましょう。