プロジェクトで Puppeteer を使用するには、まず Puppeteer をインストールする必要があります。
インストール
npm i puppeteer
# or "yarn add puppeteer"
Puppeteer をインストールすると、API で動作することが保証されている最新バージョンの Chromium(Mac で約 170 MB、Linux で約 282 MB、Win で約 280 MB)がダウンロードされます。ダウンロードのスキップ、別のパスへのダウンロード、または別のブラウザのダウンロードを行うには、環境変数をご覧ください。
Puppeteer-Core
バージョン 1.7.0 以降では、puppeteer-core
パッケージを公開しています。このバージョンの Puppeteer は、デフォルトではブラウザをダウンロードしません。
npm i puppeteer-core
# or "yarn add puppeteer-core"
puppeteer-core
は、既存のブラウザのインストールを開始するか、リモート ブラウザに接続するための Puppeteer の軽量バージョンです。インストールする puppeteer-core のバージョンが、接続するブラウザと互換性があることを確認してください。
人形と人形中心の比較をご覧ください。
使用法
Puppeteer は、最新のメンテナンス LTS バージョンに従います。
Puppeteer は、他のブラウザ テスト フレームワークを使用しているユーザーにはよくご存じでしょう。Browser
のインスタンスを作成してページを開き、Puppeteer の API で操作します。
スクリーンショットを保存
たとえば、https://example.com
に移動して、スクリーンショットを example.png
として保存するには、次のコードを example.js
に保存します。
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
await page.screenshot({ path: 'example.png' });
await browser.close();
})();
Puppeteer は、最初のページサイズを 800x600 ピクセルに設定し、これによりスクリーンショットのサイズを定義します。ページサイズは Page.setViewport() でカスタマイズできます。
PDF を作成
ファイルに hn.js
という名前を付けて保存します。
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://news.ycombinator.com', {
waitUntil: 'networkidle2',
});
await page.pdf({ path: 'hn.pdf', format: 'a4' });
await browser.close();
})();
コマンドラインでスクリプトを実行します。
node hn.js
PDF の作成について詳しくは、Page.pdf() をご覧ください。
ページのコンテキストでスクリプトを評価
ファイルに get-dimensions.js
という名前を付けて保存します。
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
// Get the "viewport" of the page, as reported by the page.
const dimensions = await page.evaluate(() => {
return {
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight,
deviceScaleFactor: window.devicePixelRatio,
};
});
console.log('Dimensions:', dimensions);
await browser.close();
})();
コマンドラインでスクリプトを実行します。
node get-dimensions.js
評価メソッドと関連メソッド(evaluateOnNewDocument
や exposeFunction
など)について詳しくは、JavaScript を評価するをご覧ください。
デフォルトのランタイム設定
ヘッドレス モードを使用
Puppeteer が Chromium をヘッドレス モードで起動します。Chromium の完全版を起動するには、ブラウザの起動時に headless
オプションを設定します。
const browser = await puppeteer.launch({ headless: false }); // default is true
バンドル版の Chromium を実行している
Puppeteer は、デフォルトで特定バージョンの Chromium をダウンロードして使用するため、その API は追加の設定なしで確実に動作します。別のバージョンの Chrome または Chromium で Puppeteer を使用するには、Browser
インスタンスの作成時に実行可能ファイルのパスを渡します。
const browser = await puppeteer.launch({ executablePath: '/path/to/Chrome' });
Firefox Nightly で Puppeteer を使用することもできます(試験運用版)。
詳細については、Puppeteer.launch()
をご覧ください。
より詳しく:
- How-To Geek - Chromium と Chrome の違い
- Chromium ドキュメントで、Linux ユーザー向けの相違点をいくつか説明しています。
新しいユーザー プロフィールを作成する
Puppeteer は独自のブラウザ ユーザー プロファイルを作成し、実行のたびにクリーンアップします。
次のステップ
- 詳しくは、ヘッドレス Chrome についての説明をご覧ください。
- 例を確認します。