RiffaMedia

Belajar Web Scrapping~ Tutorial Belajar Node JS Web Automation dengan dan Puppeteer.
Kali ini kita akan belajar bagaimana cara membuat bot untuk web scrapping dengan bahasa pemrograman nodejs, dengan menggunakan library puppeteer. Sebelum mengikuti tutorial ini, alangkah baiknya teman teman semuanya mengikuti tutorial kami sebelumnya agar bisa terstruktur dan tidak bingung jika menemukan istilah istlah yang baru dalam puppteer.

Kenapa Memilih PUppeter untuk web scrapping

• Alasan pertama kenapa memilih puppeteer adalah karena dengan puppeter bisa menangani web full javascript, yang konten akan keluar dengan jeda waktu tertentu,   karena menggunakan puppeteer menggunakan  browser. Berbeda dengan web scrapping dengan web request tanpa browser yang bisa menangani web web sederhana saja.
• Dibandingkan dengan frame work lain seperti selenium, puppeter sangat ringan karena tidak menggunakan chrome driver.
• Puppeter lebih tangguh karena framework ini di bikin langsung oleh tim devtoolnya google chrome   / Google. Raksasa di dunia internet

Metod yang bisa kita gunakan untuk Web scrapping

await page.content() : Untuk mendapatkan html source dari web

• • Page.$()   : Digunakan untuk mencari locator dengan singgel ouput
  • Page.$$() : Digunakan untuk mencari locator dengan multiple ouput
  • Page.$x() : Digunakan untuk mencari locator dengan multiple ouput dan locator berupa array
  • Page.$eval() : Metod ini menjalankan perintah javascript document.querySelector di dalam halaman dan meneruskan hasilnya sebagai argumen pertama ke pageFunction.
  • Page.$$eval() :   Metod ini menjalankan Array.from(document.querySelectorAll(selector)) di dalam halaman dan meneruskan hasilnya sebagai argumen pertama
  • Page.evaluate() : Metod ini menjalankan menjalankan fungsi javascript dalam konteks halaman dan mengembalikan sebuah output.
  • Page.evaluateHandle() : Metod ini sama seperti evaluate, akan tetapi ouput berupa handle ( wrapped pada in-page object ). Jadi kita perlu memprosesnya lagi menggunakan jsonValue().

Scrape Singgle Elemen Dengan Page.$() dan Page.evaluate()

Pertama kita cari dulu lokator menggunakan method page.$()

	
const elemn = await page.$(selector)

Setelah itu kita scrape dengan evaluate

const result = await elemn.evaluate( (x) => x.innerHTML)
console.log(result )

	
const result = await page.evaluate( (elemn) => elemn.innerHTML,elemn)
console.log(result )

Scrape Singgle Elemen Dengan Page.$$() dan Page.evaluate()

Pertama kita cari dulu lokator menggunakan method page.$$() .Ingat jika menggunakan page.$$() , maka output berupa array. Jadi kit perlu melakukan perulangan

const elemn = await page.$$(selector)

Setelah itu kita scrape dengan evaluate dengan perulangan.

	
for ( let el of allElmn){
        const result1 = await elemn.evaluate(x => x.innerText)
        console.log(result1 )
        const result2 = await page.evaluate(el => el.innerText , el)
        console.log(result2 )
}

Jika kita ingin menargetkan index tertentu , maka kita bisa langsung tergetkan index keberapa.

const allElmn = await page.$$(selector)
const elmn = allElmn[0]
const result1 = await elmn.evaluate(elmn => elmn.innerText)
console.log(result1)

const allElmn = await page.$$(selector)
const elmn = allElmn[0]
const result2 = await page.evaluate(elmn => elmn.innerText,elmn)
console.log(result2)

Scrape Singgle Elemen Dengan Page.$eval()

Dari sekian cara, penggunaan $eval memiliki cara yang simple.

	
const result= await page.$eval(selector, el => el.innerText)
console.log(result)

Scrape Singgle Elemen Dengan Page.$$eval()

Scrapping dengan Page.$$eval() memiliki sintax mirip dengan penggunaan Page.$eval(). Akan tetapi kita perlu malukan looping karena result dari Page.$$eval() adalalh berbentuk array.

const results= await page.$$eval(selector,(el)=>{
    return el.map(el=>el.textContent);
})


for (let el of results){
        console.log(el)
 }

Scrape Singgle Elemen Dengan Page.$x() Dan Page.Evaluate

Penggunaan page.$x() , sama seperti ketika kita mengunakan page.$$(). Bedanya hanya pada locatornya saja. JIka pakai page.$x() , locator menggunakan xpath.

const results= await page.$x(selector) 
for (let el of results){    
       const text = await el.evaluate(el => el.innerText)
       console.log(text )
 }

Scrape Singgle Elemen Dengan Page.Evaluate

	
const evText = await page.evaluate(() => {
        const elmn = document.querySelector(selector);
        const text =  elmn.innerText;
        return text;
});
console.log(evText)

Scrape Singgle Elemen Dengan Page.EvaluateHandle

const jsHandle = await page.evaluateHandle(() => {
    return document.getElementsByTagName('h4');
});
console.log(jsHandle); // JSHandle
const result = await page.evaluate(els => els[0].textContent, jsHandle);
console.log(result);

const evTextHand = await page.evaluateHandle(() => {
    return document.querySelector(selector);
});
console.log(evTextHand);
console.log(await evTextHand.evaluate(el=> el.textContent))

const result = await page.evaluateHandle(() => {
    return document.querySelector(selector).textContent;
});
console.log(await result.jsonValue());