Puppeteerを使って、ブラウザ(ヘッドレスChrome)を操作する(in Docker コンテナ)
どうも〜
コワーキングスペース松原ガレッジの管理人(五島)です。
ウェブページにアクセスして色々確認する必要性ができたので、自動化しましたという話です。
Puppeteerというツールを利用して、ブラウザ(ヘッドレスChrome)を操作しました。
結論から知りたい!!というせっかちな方
安心してください、履いてますよ
ではなくGitHubにソースを公開しました。
色々なサイトで載ってる方法を試したのですが、
Chrome の進化が早いからか最初のセットアップで上手くいかないケースが多かったのでDockerfileを少し編集しています。
動作環境
- macOS 10.15.5
- Docker for Mac
- NodeJS v12.18.0
- Puppeteer 4.0.1
- Chrome(ヘッドレス) 83.0.4103.116
念の為注意
上記の方法におけるウェブページの回遊は用法用量や対象のサービスの規約を守って利用してください。
例えば、特定のサービスに短時間にたくさんのアクセスを行えば、それはサービスに対する攻撃とみなされる可能性が高いです。
この記事を参考にして行ったとしても、関連して生じたあらゆる損害等は、理由の如何に関わらず一切責任を負いません。
自己責任でお願いいたしますm( )m
Puppeteer とは? 実際に動かしながら試してみる
Puppeteer は人に変わってプログラムでChromeを制御してくれるツールです。
例えばこのようなプログラムでは、ページにアクセスしてスクリーンショットを撮ることができます。
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless: true,
executablePath: '/usr/bin/google-chrome-stable',
args: ['--no-sandbox']
});
// ↓後の例ではここの中身だけ変更していきます
const baseUrl = 'https://example.com';
const page = await browser.newPage();
await page.goto(baseUrl, {waitUntil: "networkidle2"});
await page.screenshot({path: './dist/example.png'});
// ↑
await page.close();
await browser.close();
})();
実際に取得したスクリーンショットはこちら
他にもページ内の要素に対してクリックできたりします。
クリックして他のページへ遷移してみましょう。
( プログラム内 https://poly-kaigo.com は弊社が運営するサービスです)。
// 前の処理があります
const baseUrl = 'https://poly-kaigo.com';
const page = await browser.newPage();
await page.goto(baseUrl, {waitUntil: "networkidle2"}); // トップページへ
await page.screenshot({path: './dist/example1.png', fullPage: true});
page.click('article.article-item.post-671.post.type-post.status-publish.format-standard.has-post-thumbnail.hentry.category-manga > div.head > a') // リンクを指定してクリック
await page.waitForNavigation({timeout: 50000, waitUntil: "networkidle2"});
await page.screenshot({path: './dist/example2.png', fullPage: true});
// 後の処理があります
こちらがトップページ
こちらがリンクをクリックしたページ
とこんな風に人間に変わって色々操作してくれます。
他にもどんな操作ができるのか気になった方はぜひPuppeteerで確認してみてください。
定期的にウェブページのスクリーンショットを取りにいったり、内容を確認したりする必要がある方はぜひやってみてくださいね〜(^^)
まとめ
今回はPuppeteerを利用してウェブページへアクセスする方法を書きました。
これからも少しずつ技術記事をアップしていくので、覗いていただけるとありがたいです!!
松原ガレッジでは、PCの使い方からHP制作、ウェブシステムの開発までまるっと請け負っています。
「こうゆういいアイデアがあるんだけど、作ってくれないかな〜、できるのかな〜」
「この仕事、自動化できないかな〜」
という方は一度遊びに来てみてください(^^)
何かしらのお力添えはできると思います!
