Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Puppeteerによる優しいウェブサイトクロール
Search
Osamu Nagayama
December 03, 2019
Programming
50
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Puppeteerによる優しいウェブサイトクロール
Osamu Nagayama
December 03, 2019
More Decks by Osamu Nagayama
See All by Osamu Nagayama
摂阿毘達磨義論より 摂色分別の章
naga3
0
160
呼吸瞑想のススメ
naga3
1
120
Scrapyドキュメント翻訳活動について
naga3
1
140
Other Decks in Programming
See All in Programming
言語を使う側から、作る側へ。 自作 Lisp で得た新たな気づき。
andpad
0
140
komatsuna「分散システムにおけるバグ分析手法」
komatsunaqa
0
150
複数の Claude Code が"放置"されてしまう問題をCLI ダッシュボードを自作して解決した話
sumihiro3
1
610
2年かけて Deno に DOMMatrix を実装した話 / How I implemented DOMMatrix in Deno over two years
petamoriken
0
190
PHP初心者セッション2026 〜生成AIでは見えない裏側を知る:今だからLAMPを通して仕組みを学ぶ〜
kashioka
0
750
Foundation Models frameworkで画像分析
ryodeveloper
1
320
Japan Community Day at Kubecon + CloudNativeCon Japan 2026: Learning Container Privilege Control by Building My Own Low-Level Container Runtime
ternbusty
1
110
テーブルをDELETEした
yuzneri
0
130
OpenSpecのproposalにbrainstormingを持たせてみた
tigertora7571
1
180
使用 Meilisearch 建立新聞搜尋工具
johnroyer
0
200
『コードを書く以外の』エンジニアリング〜課金基盤移行プロジェクト推進のためのTips4選
yuriko1211
0
560
20260722_microCMSで考える、AI時代のコンテンツ運用設計
yosh1
0
190
Featured
See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
23k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.5k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
123
22k
AI: The stuff that nobody shows you
jnunemaker
PRO
9
860
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
280
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
340
From π to Pie charts
rasagy
0
240
What’s in a name? Adding method to the madness
productmarketing
PRO
24
4.1k
Designing Powerful Visuals for Engaging Learning
tmiket
1
470
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.4k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
1
2.2k
ラッコキーワード サービス紹介資料
rakko
1
4.1M
Transcript
Puppeteerによる優しい ウェブサイトクロール @naga3 LAPRAS シニアエンジニア
Puppeteerとは Node.jsからAPIでChrome(Chromium)を制御できるライブラリ。 実際に内部でChrome(Chromium)が動くので、ブラウザで出来ることならば ほぼ全て素直に実現可能。 例: ・ログイン ・ボタンのクリック ・無限スクロールページのスクロール
Pupetteer ←間違い Puppetter ←間違い Puppeteer ←正解! 中の「p」と「e」が2文字ずつ。
実際にクロールしてみよう 厚生労働省の「人材サービス総合サイト」 (https://www.jinzai-sougou.go.jp/) から、 労働派遣事業一覧のデータを取得する。
URLが変わらない! 検索画面のURL https://www.jinzai-sougou.go.jp/srv110.aspx 事業所一覧結果のURL https://www.jinzai-sougou.go.jp/srv110.aspx
ページ遷移するときの挙動を調べる 都道府県検索から「東京」の IDをDevToolsから調べ る。コンソール画面で実際にクリックできるか試して みても良い。jQuery風のSyntaxが使える。 $('#ctl00_ctl00_cphHFContent_cphContent_cbTokyo').click()
ページ遷移するときの挙動を調べる 同様に、検索ボタンのIDも調べておく。
Puppeteerでページ遷移する // 検索のトップページへ遷移する。 await page.goto('https://www.jinzai-sougou.go.jp/srv120.aspx') // 「東京」のチェックボックスをクリック await page.click('#ctl00_ctl00_cphHFContent_cphContent_cbTokyo') //
「検索」ボタンをクリック await page.click('#ctl00_ctl00_cphHFContent_cphContent_btnSearch') // テーブルが出てくるまで待つ await page.waitFor('table#search')
Puppeteer Tips
ログイン 一度ログインすれば、Browserインスタンスを閉じ ない限りChrome自体は閉じられないので、 Page インスタンス(タブ)を増やせば、ログインを継続 できる。 Browser Page
ページ遷移完了を待つ await page.goto(URL) loadイベント完了まで待つ。これだけで十分な場合が多い。 await page.goto(URL, ‘networkidle2’) コネクション数が2個以下である状態が500ミリ秒以上続くまで待つ。SPAサイトで使える。
ページ遷移完了を待つ await page.waitFor(selector) selectorの要素が出現するまで待つ。 await page.waitFor(timeout) timeoutの時間が過ぎるまで待つ。
ページ遷移完了を待つ await page.waitFor(() => document.querySelectorAll(‘selector1, selector2’).length) selector1かselector2のどちらかの要素が出現するまで待つ。 waitFor関数はブラウザ内部で動く関数を引数に取ることができ、戻り値が trueになった時点で遷移する。 DOMのquerySelectorAll関数は指定した複数のセレクタに一致するリストを返す。
Happy Puppeteer life !