ソース公開しています https://github.com/howdy39/web-update-notification
Puppeteer と GASを利用した Web 監視2018/04/03 トップゲート社 第2回 フロントエンド勉強会1
View Slide
本日の内容21. Puppeteer とは2. Puppeteer と GASを利用した Web 監視
1. Puppeteer とは3
PuppeteerChrome を Node.js から操作するライブラリ● DevTools Protocol で操作している● ヘッドレスモードで起動することでGUIなしでも使える4
Puppeteer5
比較6
特徴その1画面キャプチャを撮る● 画面サイズを変えることも可能7
特徴その2画面を操作する● DOMの内容を取得することも可能8
特徴その3SPA でもOK● Chrome を操作しているから、JS が動く9
その他● テストも考慮されている● 任意のDOMだけ切り出してキャプチャも可能● HTTPリクエストのインターセプト● 描画にかかった時間などの計測● etc10
2. Puppeteer とGASを利用したWeb 監視11
経緯12技術情報のキャッチアップ公式情報が一番早い● ブログとかは RSS/Atom を用意してくれてるだけど・・・
用意してくれていないサイトが意外とある・・・→ タブを開いといて、毎日リロードしてチェックしてた13
なのでWeb監視する仕組みを作った14
151. cron で定期的に Node を実行する2. puppeteer を用いて Web スクレイピング3. GAS で建てた Web サーバーに Post でスクレイピング結果を送信4. スクレイピング結果を受け取り、履歴をスプレッドシートに登録5. 履歴に変更があったら Slack で通知
デモ16
17ここをpuppeteerで取得GCE 上の Node からpuppeteer を実行GAS でスプレッドシートの履歴を書込 &Slack で通知