Google Chrome Headless 雑感 ＆ 比較

MDH 社内勉強会 LT Thursday 資料

Transcript

1. (PPHMF
   $ISPNF
   )FBEMFTT
   ࡶײ
   
   ൺֱ 
 .%)
   "%ςΫϊϩδʔہ
   ໦ా
   ఩࿏ 
   
   
2. ࿩͢͜ͱ
   w $ISPNF
   )FBEMFTTϞʔυ࢖ͬͯΈͨ
   w طଘ)FBEMFTTϒϥ΢βͱͷൺֱ
   w ·ͱΊ 
   
   
3. $ISPNJVN
   )FBEMFTT
   NPEF
 
   Y 
   
   
4. 'SPOUFOE
   "OHVMBS+4
   Y
   
   &4
   
   -FTT
   
   6*#PPUTUSBQ
   
   3&45GVM
   "1*
 ɹɹɹɹɹOQN
   
   CPXFS
   (VMQ
 8FC4FSWFS
   4DBMB 4UBCMF
   
   #FUB
   
   %FW
   
   $BOBSZ
   ˡ
   ҆ఆɹɹɹɹɹɹɹਓப
   ˠ 
   
   
5. 'SPOUFOE
   "OHVMBS+4
   Y
   
   &4
   
   -FTT
   
   6*#PPUTUSBQ
   
   3&45GVM
   "1*
 ɹɹɹɹɹOQN
   
   CPXFS
   (VMQ
 8FC4FSWFS
   4DBMB ·ͩ4UBCMF൛Ͱ͸࢖͑·ͤΜɻʢ࣌఺ʣ
   #FUB
   
   %FW
   
   $BOBSZͷ͍ͣΕ͔Ͱࢼ͠·͠ΐ͏ɻ ❌ 
   
   
6. ඞཁͳ΋ͷ
   w (PPHMF
   $ISPNF W
   w /PEFKT W
   w DISPNFSFNPUFJOUFSGBDF
 IUUQTHJUIVCDPNDZSVTBOEDISPNFSFNPUFJOUFSGBDF 
   
   
7. ಈ͔ͯ͠ΈΔ
   ྫ͑͹͜͜Λऔಘ͍ͨ͠ 
   
   
8. ಈ͔ͯ͠ΈΔᶃ
   > alias canary='/Applications/Google\ Chrome\ Canary.app/Contents/ MacOS/Google\ Chrome\ Canary'
 > npm install chrome-remote-interface
 > canary --headless --remote-debugging-port=9222 $ISPNF઀ଓ४උ 
   
    BMMJBT͸ࣄલʹd TISD
   ͋ͨΓʹهࡌ͓ͯ͘͠ײ͡
9. ಈ͔ͯ͠ΈΔᶄ
   const CDP = require('chrome-remote-interface'); CDP((client) => { const { Page, Runtime } = client; Promise.all([ Page.enable() ]).then(() => { return Page.navigate({ url: 'https://www.yahoo.co.jp/' }); }); const command = 'document.querySelector(".topicsindex").innerText'; Page.loadEventFired().then(() => { Runtime.evaluate({expression: command}).then(result => { console.log(result.result.value); client.close(); }); }); }).on('error', (err) => { console.log('ブラウザに接続できません。詳細はこちら↓\n', err); }); DIKT 
   
   
10. ಈ͔ͯ͠ΈΔᶄ
    ݟͮΒ͍ͷͰը૾Ͱʜ 
    
    
11. ಈ͔ͯ͠ΈΔᶅ
    OPEFKTͰεΫϦϓτΛ࣮ߦ 
    
    
12. ࡶײ
    w 8JOEPXT؀ڥʹରԠ͍ͯ͠ͳ͍
 $ISPNFଆͷ໰୊ɻۙ೔ରԠ༧ఆ
    w "1*ͷυΩϡϝϯτ͕Θ͔Γʹ͍͘
 ެࣜαϯϓϧ͕গͳ͍
    w هड़ʹগʑบ͕͋Γɺ͋·Γચ࿅͞Ε͍ͯͳ͍
 ˠݱঢ়Ͱ1SPEVDUJPOͷςετʹ࢖͏ؾʹ͸ͳΕͳ͍ʜ 
    
    
13. طଘͷIFBEMFTTϒϥ΢β͸ʁ 
    
    
14. 
    
    
15. 8SBQQFS
    GPS
    1IBOUPN+4 w 1IBOUPN+4ͷϥούʔ
    w γϯϓϧͳ໋ྩهड़
    w ࣮ߦ؀ڥ͸&MFDUSPOϕʔε OPEFKT
    
    $ISPNJVN 
    
    
16. ಈ͔ͯ͠ΈΔᶃ
    var Nightmare = require('nightmare'); var nightmare = Nightmare({ show: false }); nightmare .goto('https://www.yahoo.co.jp/') .evaluate(() => { return document.querySelector('.topicsindex').innerText; }) .then(function (result) { console.log(result); }) .catch(function (error) { console.error('error:', error); }); ONKT 
    
    
17. ಈ͔ͯ͠ΈΔᶃ
    ݟͮΒ͍ͷͰ SZ 
    
    
18. ಈ͔ͯ͠ΈΔᶄ
    OPEFKTͰεΫϦϓτΛ࣮ߦ 
    
    
19. ൵͍͠ݱ࣮
    $ISPNF
    )FBEMFTT /JHIUNBSF 
    
    
20. ·ͱΊ
    /JHIUNBSFKTͷํ͕Θ͔Γ΍ͯ͘͢؆୯
    ղࢄʂ 
    
    
21. ·ͱΊ
    w $ISPNF
    )FBEMFTT͸࣮࣭ग़ͨ͹͔ΓͳͷͰ
 ֤छςετϑϨʔϜϫʔΫ͕ରԠ͍ͯ͠ͳ͍ɻ
    w &MFDUSPOͰ͸ͳ͘ɺ$ISPNFωΠςΟϒͰϢʔβʔʹۙ ͍؀ڥͰςετͰ͖Δ͜ͱʹՁ஋͕͋Δɻ
 8JOEPXT؀ڥ
    
    $ISPNFͳͲɻ·ͩରԠͯ͠ͳ͍͚Ͳɻ
    w কདྷతʹ/JHIUNBSFͷΑ͏ʹίʔυ͕هड़͠΍͘͢ͳΔ ϥΠϒϥϦ͕ग़ͯ͘Ε͹े෼બ୒ࢶʹͳΔɻ 
    
    
22. ࢀߟ৘ใ
    w ެࣜ
 IUUQTDISPNJVNHPPHMFTPVSDFDPNDISPNJVNTSD NBTUFSIFBEMFTT
    w ϔουϨε
    $ISPNF
    ͜ͱ͸͡Ί
 IUUQTEFWFMPQFSTHPPHMFDPNXFCVQEBUFTIFBEMFTTDISPNF
    w $ISPNF
    %FW5PPMT
    1SPUPDPM
    7JFXFS
    
    MBUFTU
    UJQPGUSFF 
 IUUQTDISPNFEFWUPPMTHJUIVCJPEFWUPPMTQSPUPDPMUPU
    w 2JJUB
    
    $ISPNFͷϔουϨεϒϥ΢β͕΍ͬͯ͘Δɻͱ͍͏Θ͚Ͱࢼͯ͠Έͨɻ
 IUUQRJJUBDPNEFWOFLPJUFNTGFBFC 
    
    
23. 
    
     ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠