一個關於網頁爬蟲的簡短入門教程
網頁爬蟲的任務是下載網頁並從中提取某種信息。
我最近使用了一個附帶LCD顯示器的Arduino板製作了一個小項目。使用Johnny-Five,可以使用Node.js來編程Arduino,我想要從山頂上測量的溫度,並在Arduino板上顯示出來。
我使用了Google開發的Puppeteer來進行爬蟲任務。Puppeteer是一個很棒的工具,它是一個可以用來控制無頭Chrome實例的Node.js庫。
這意味著我們基本上是使用Chrome,只是以編程的方式操作。
Puppeteer有很多實際的用途,包括自動化測試,製作屏幕截圖,創建單頁面應用程序的服務器端渲染版本等等。
首先,通過以下命令安裝它:
npm install puppeteer
在Node.js文件中引入它:
const puppeteer = require('puppeteer');
然後,我們可以使用launch()
方法創建一個瀏覽器實例:
(async () => {
const browser = await puppeteer.launch()
})()
我們使用了await
,所以我們必須將這個方法調用包裹在一個async函數中,然後立即調用這個函數。
接下來,我們可以使用browser
對象上的newPage()
方法來獲取page
對象:
(async () => {
const browser = await puppeteer.launch()
const page = await browser.newPage()
})()
接下來,我們在page
對象上調用goto()
方法來加載頁面:
(async () => {
const browser = await puppeteer.launch()
const page = await browser.newPage()
await page.goto('https://website.com')
})()
最後,我們可以通過調用page
的evaluate()
方法來獲取頁面的內容。該方法接受一個回調函數,其中我們可以添加檢索所需頁面元素的代碼。該函數在頁面的上下文中執行,所以我們可以訪問document
和所有瀏覽器API。我們返回一個新的對象,這將是我們的evaluate()
方法調用的結果。
我們可以使用Selectors API從頁面中檢索數據。
(async () => {
const browser = await puppeteer.launch()
const page = await browser.newPage()
await page.goto('https://website.com')
const result = await page.evaluate(() => {
//...
})
})()
現在讓我們來解決我遇到的具體問題。以下是一個托管在山頂上的氣象站的頁面,海拔3315米: http://www.meteocentrale.ch/it/europa/svizzera/meteo-corvatsch/details/S067910/
我想要獲取那個-9°C
的文本。使用瀏覽器檢查器,我可以看到它附有一個column-4
類。這不是一個理想的類名,因為它沒有意義,而且如果他們決定添加一個新的列,類名可能會改變,但這就是我們所得到的:
到目前為止,這是完整的代碼:
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch()
const page = await browser.newPage()
await page.goto('http://www.meteocentrale.ch/it/europa/svizzera/meteo-corvatsch/details/S067910/')
const result = await page.evaluate(() => {
let temperature = document.querySelector('.column-4').innerText
return {
temperature
}
})
console.log(result)
browser.close()
})()
如果我們運行這段代碼,result
將具有以下值:
{
temperature: '-9°C'
}
或者是當前的溫度。