スクレイピングとはプログラミングを使ってwebサイトから情報を取得する方法である。
スクレイピングは基本2種類あって、requestを送る方法とheadless browserを使ってbrowserを動かす方法の二つである。
requestを送る方法は処理自体は軽いが、Vue.jsやReact.jsを使ったSPAだと取得が難しい。
headless browserを使う方法は処理は重いが、SPAでも取得が可能。
テスト用途で使う時は、もう少しきちんと使うべきかもしれないが
スクレイピング用途で使う時はclickとtype以外はevaluate(javascript実行)のゴリ押しでいい。
参考URL Puppeteer.jsのgithub
https://github.com/puppeteer/puppeteer
npm init
npm install puppeteer
npm install cheerio
の3つをインストールする。
puppeteerはheadless browser
cheerioは取得したhtmlをjqueryライクで加工できるパーサーである。
起動
下記例はgithubに載っている例を少し改良したものである。
launch関数でbrowserを作成。この時、headless:falseにしてあげることでブラウザを出しながら動かせる。
newPage関数でpageを作成。
goto関数でそのページに遷移。
close関数はbrowserを閉じるので、一旦コメントアウトしておく。
constpuppeteer=require('puppeteer');(async()=>{constbrowser=awaitpuppeteer.launch({headless:false});constpage=awaitbrowser.newPage();awaitpage.goto('https://example.com');//await browser.close();})();
スクリーンショット
page.screenshot関数は現在ページのスクリーンショットを撮る。
pathのところに画像を保存。
constpuppeteer=require('puppeteer');(async()=>{constbrowser=awaitpuppeteer.launch({headless:false});constpage=awaitbrowser.newPage();awaitpage.setViewport({width:800,height:600});awaitpage.goto('https://example.com');awaitpage.screenshot({path:"test.jpg"});//await browser.close();})();
htmlの取得
直接htmlを取得することができない。
セレクターで情報を取得した後、evaluateで(javascript)実行してあげないといけない。
constpuppeteer=require('puppeteer');constcheerio=require('cheerio');(async()=>{constbrowser=awaitpuppeteer.launch({headless:false});constpage=awaitbrowser.newPage();awaitpage.setViewport({width:800,height:600});awaitpage.goto('https://example.com');constbodyHandle=awaitpage.$('body');consthtml=awaitpage.evaluate((body)=>body.innerHTML,bodyHandle);const$=cheerio.load(html);varh1=$('h1');console.log(h1.html());//await browser.close();})();
クリックして遷移する。
goto時、waitUntilオプションがないとすぐセレクターを使うとエラーが起こってしまう。
クリック時はwaitForNavigationと一緒に使ってあげないとエラーが出ることもある。
クリックの中身はセレクター。
constpuppeteer=require('puppeteer');(async()=>{constbrowser=awaitpuppeteer.launch({headless:false});constpage=awaitbrowser.newPage();awaitpage.goto('xxxxxxxx',{waitUntil:'domcontentloaded'});awaitPromise.all[page.waitForNavigation(),page.click('yyyyyy')];//await browser.close();})();
入力
constpuppeteer=require('puppeteer');(async()=>{constbrowser=awaitpuppeteer.launch({headless:false});constpage=awaitbrowser.newPage();awaitpage.goto('xxxxxxxxxxx',{waitUntil:'domcontentloaded'});awaitpage.type('yyyyyyyyyyy',"testtest");//await browser.close();})();
待機
page.WaitFor関数でミリ秒待つ。
constpuppeteer=require('puppeteer');(async()=>{constbrowser=awaitpuppeteer.launch({headless:false});constpage=awaitbrowser.newPage();awaitpage.goto('xxxxxxx',{waitUntil:'domcontentloaded'});awaitpage.waitFor(3000);//await browser.close();})();