摘要：爬蟲初入前端，剛剛接觸，對于耳聞已久的爬蟲非常神往，所以有了這篇文章，項目代碼在文章末尾需求抓取天涯論壇重慶地區板塊的文章列表信息。

初入前端，剛剛接觸node，對于耳聞已久的node爬蟲非常神往，所以有了這篇文章，項目代碼在文章末尾

抓取天涯論壇重慶地區板塊的文章列表信息。

node.js

superagent(客戶端請求代理模塊)

cheerio(為服務器特別定制的，快速、靈活、實施的jQuery核心實現)

安裝

npm install superagent cheerio --save

在項目中引入cheerio，superagent

const superagent = require("superagent")
const cheerio = require("cheerio")

指定需要抓取的域名

const mainUrl = "http://bbs.tianya.cn"  //天涯論壇主域名
let url = "/list-45-1.shtml"    //重慶區域域名

請求數據

superagent.get(mainUrl + url).end(function (err, res) {
        // 拋錯攔截
        if (err) {
            return
            throw Error(err)
        }
        console.log(res)
    }

對頁面內容進行分析，提取對我們需要的內容

以下圖片是頁面信息

我們需要的列表在class為mt5的div下。

整個網頁有多個mt5，繼續向下找。

每一欄信息在(".mt5 table tbody tr")下。

調用cheerio選取(".mt5 table tbody tr")

let $ = cheerio.load(res.text)
$(".mt5 table tbody tr").each((index, item)=>{
//這里是每一項的信息
})

找到了信息，下面對找到的信息進行解析

找到需要解析的數據，對數據進行解析，保存我們需要的數據

        let $ = cheerio.load(res.text)
        let data = []   //存儲抓去到的數據
        $(".mt5 table tbody tr").each((index, item) => {
            let _this = $(item)
            //根據頁面判斷是否是文章
            if ($(_this.children()[0]).hasClass("td-title")) {
                //對數據進行存儲
                let obj
                let title = $(_this.find(".td-title")).find("span").next().text()
                // let text = $(_this.find("a")[0]).text()  //另一種選擇器
                let type = $(_this.find(".td-title")).find(".face").attr("title")
                let goto = $(_this.find(".td-title")).find("span").next().attr("href")
                let author = $(_this.children()[1]).text()
                let point = $(_this.children()[2]).text()
                let time = $(_this.children()[3]).text()
                obj = {
                    title: title,
                    type: type,
                    url: mainUrl + goto,
                    author: author,
                    point: point,
                    time: time
                }
                if (obj.title != "") {
                    //判斷如果有內容，則推送到data中
                    data.push(obj)
                }
            }
        })

此時需要把data中保存的數據存到想要保存的文件中需要用到node的fs模塊

1.引入fs模塊

const fs = require("fs")

2.存儲數據到本地

在根目錄下創建data文件夾

    fs.writeFile(__dirname + "/data/articleLists.json", JSON.stringify({
                status: 0,
                data: data
            }), function (err) {
                if (err) {
                    console.log(err)
                } else {
                  console.log("寫入文章列表完成")
                }
            })

現在爬蟲會把爬到的數據存儲到本地了
ok，到這里我們的爬蟲已經完成了，接下來我們需要對它進行優化

現在我們的爬蟲只能爬取當前頁的信息，我們來改一下，讓它也能翻頁

分析翻頁按鈕，天涯論壇的列表也的下一頁按鈕中有一個a標簽，里邊的url加上之前我們記錄的mainUrl就是下一頁的標簽。所以，在爬蟲爬取完本頁的數據后，讓爬蟲向下一頁的鏈接發一個新的請求就可以繼續爬去了。

//單次讀取后，找到下一頁的鏈接，繼續抓取下一頁的數據
        let nextPage = $(".mt5").next().find(".short-pages-2 .links")
        nextPage.children().each((index, item) => {
            if ($(item).text() === "下一頁") {
                let url = $(item).attr("href")
                getData(url)    //剛才我們請求數據的方法，命名為這個函數
            }
        })

現在，爬蟲讀取完當前頁數據后就會繼續爬取下一頁的數據。

最后我還增加了一個頁碼，每一頁數據，多帶帶進行記錄。下面是完整的代碼

const superagent = require("superagent")
const cheerio = require("cheerio")
const fs = require("fs")

const mainUrl = "http://bbs.tianya.cn"  //天涯論壇主域名
let url = "/list-45-1.shtml"    //重慶區域域名

let index = 1   //記錄頁碼數
//發送請求獲取頁面資源方法
let getData = (url) => {
    // 使用superagent請求頁面數據
    superagent.get(mainUrl + url).end(function (err, res) {
        // 拋錯攔截
        if (err) {
            return
            throw Error(err)
        }
        // 請求數據后使用cheerio解析數據
        let $ = cheerio.load(res.text)
        let data = []   //存儲抓去到的數據
        $(".mt5 table tbody tr").each((index, item) => {
            let _this = $(item)
            //根據頁面判斷是否是文章
            if ($(_this.children()[0]).hasClass("td-title")) {
                //對數據進行存儲
                let obj
                let title = $(_this.find(".td-title")).find("span").next().text()
                // let text = $(_this.find("a")[0]).text()  //另一種選擇器
                let type = $(_this.find(".td-title")).find(".face").attr("title")
                let goto = $(_this.find(".td-title")).find("span").next().attr("href")
                let author = $(_this.children()[1]).text()
                let point = $(_this.children()[2]).text()
                let time = $(_this.children()[3]).text()
                obj = {
                    title: title,
                    type: type,
                    url: mainUrl + goto,
                    author: author,
                    point: point,
                    time: time
                }
                if (obj.title != "") {
                    //判斷如果有內容，則推送到data中
                    data.push(obj)
                }
            }
        })
        if (data.length > 0) {  //判斷data中是否有內容
            //使用fs模塊對data中的數據進行儲存，也可以使用數據庫進行操作
            fs.writeFile(__dirname + "/data/articleLists" + index + ".json", JSON.stringify({
                status: 0,
                data: data
            }), function (err) {
                if (err) {
                    console.log(err)
                } else {
                    console.log("寫入文章列表完成, 當前頁碼：", index)
                    index++
                }
            })
        }
        //單次讀取后，找到下一頁的鏈接，繼續抓取下一頁的數據
        let nextPage = $(".mt5").next().find(".short-pages-2 .links")
        nextPage.children().each((index, item) => {
            if ($(item).text() === "下一頁") {
                let url = $(item).attr("href")
                getData(url)
            }
        })
    })
}
//初次執行數據抓取
getData(url)

好了本次node爬蟲快速入門文章到這里就結束了，但是這個爬蟲還有很多地方需要完善，以后我會為大家帶來更詳細的爬蟲教程