Node.js爬取科技新聞網站cnBeta(附前端及服務端原始碼)
一直很喜歡看科技新聞,多年來一直混跡於cnBeta,以前西貝的評論區是匿名的,所以評論區非常活躍,各種噴子和段子,不過也確實很歡樂,可以說那是西貝人氣最旺的時候。然而自從去年網信辦出臺了《網際網路跟帖評論服務管理規定》,要求只有實名認證的使用者,才能進行留言、評論之後,往日的活躍的的評論區瞬間淪陷,人氣大跌。其實說到底,還是西貝沒有跟上移動網際網路的潮流,至今還止步於PC網際網路時代,網頁廣告太多,而移動應用質量堪憂,體驗極差,雖然有不少第三方的應用,但由於沒有官方的支援,體驗上還是不夠好,例如如果官方釋出一些改版,第三方的應用基本都會掛掉。
所以為了方便平時閱讀cnBeta的新聞,就打算通過爬蟲把cnBeta的新聞爬下來,自建一個m站,這樣體驗可控,並且沒有廣告(`∀´)Ψ。其實專案很早就完成了,只是現在才有空(閒情)寫一篇分享出來。
概述
本專案爬蟲及服務端github地址: ofollow,noindex">github.com/hudingyu/cn…
前端github地址: github.com/hudingyu/cn…
技術細節
- 使用 async await 做非同步邏輯的處理。
- 使用 async庫 來做迴圈遍歷,以及併發請求操作。
- 使用 log4js 來做日誌處理
- 使用 cheerio 來做新聞詳情頁的分析抓取。
- 使用 mongoose 來連線mongoDB 做資料的儲存以及操作。
目錄結構
目錄結構
├── bin// 入口 │├── article-list.js// 抓取新聞列表邏輯 │├── content.js// 抓取新聞內容邏輯 │├── server.js// 服務端程式入口 │└── spider.js// 爬蟲程式入口 ├── config// 配置檔案 ├── dbhelper// 資料庫操作方法目錄 ├── middleware// koa2 中介軟體 ├── model// mongoDB 集合操作例項 ├── router// koa2 路由檔案 ├── utils// 工具函式 ├── package.json 複製程式碼
方案分析
首先看爬蟲程式入口檔案,整體邏輯其實很簡單,先抓取新聞列表,存入MongoDB資料庫,每十分鐘抓取一次。新聞列表抓取之後,在資料庫查詢列表中沒有新聞內容的新聞,開始抓取新聞詳情,然後更新到資料庫。
const articleListInit = require('./article-list'); const articleContentInit = require('./content'); const logger = require('../config/log'); const start = async() => { let articleListRes = await articleListInit(); if (!articleListRes) { logger.warn('news list update failed...'); } else { logger.info('news list update succeed!'); } let articleContentRes = await articleContentInit(); if (!articleContentRes) { logger.warn('article content grab error...'); } else { logger.info('article content grab succeed!'); } }; if (typeof articleListInit === 'function') { start(); } setInterval(start, 600000); 複製程式碼
接著看抓取新聞列表的邏輯,因為可以獲取到新聞列表的Ajax介面,所以直接呼叫介面獲取列表資訊。但是也有個問題,cnBeta新聞列表的縮圖以及文章裡的的圖片是有防盜鏈的,所以你在自己的網站是沒法直接使用它的圖片的,所以我是直接把cnBeta的圖片檔案爬下來存到自己的伺服器上。
/** * 初始化方法 抓取文章列表 * @returns {Promise.<*>} */ const articleListInit = async() => { logger.info('grabbing article list starts...'); const pageUrlList = getPageUrlList(listBaseUrl, totalPage); if (!pageUrlList) { return; } let res = await getArticleList(pageUrlList); return res; } /** * 利用分頁介面獲取文章列表 * @param pageUrlList * @returns {Promise} */ const getArticleList = (pageUrlList) => { return new Promise((resolve, reject) => { async.mapLimit(pageUrlList, 1, (pageUrl, callback) => { getCurPage(pageUrl, callback); }, (err, result) => { if (err) { logger.error('get article list error...'); logger.error(err); reject(false); return; } let articleList = _.flatten(result); downloadThumbAndSave(articleList, resolve); }) }) }; /** * 獲取當前頁面的文章列表 * @param pageUrl * @param callback * @returns {Promise.<void>} */ const getCurPage = async(pageUrl, callback) => { let num = Math.random() * 1000 + 1000; await sleep(num); request(pageUrl, (err, response, body) => { if (err) { logger.info('current url went wrong,url address:' + pageUrl); callback(null, null); return; } else { let responseObj = JSON.parse(body); if (responseObj.result && responseObj.result.list) { let newsList = parseObject(articleModel, responseObj.result.list, { pubTime: 'inputtime', author: 'aid', commentCount: 'comments', }); callback(null, newsList); return; } console.log("出錯了"); callback(null, null); } }); }; const downloadThumbAndSave = (list, resolve) => { const host = 'https://static.cnbetacdn.com'; const basepath = './public/data'; if (list.indexOf(null) > -1) { resolve(false); } else { try { async.eachSeries(list, (item, callback) => { let thumb_url = item.thumb.replace(host, ''); item.thumb = thumb_url; if (!fs.exists(thumb_url)) { mkDirs(basepath + thumb_url.substring(0, thumb_url.lastIndexOf('/')), () => { request .get({ url: host + thumb_url, }) .pipe(fs.createWriteStream(path.join(basepath, thumb_url))) .on('error', (err) => { console.log("pipe error", err); }); callback(null, null); }); } }, (err, result) => { if (!err) { saveDB(list, resolve); } }); } catch(err) { console.log(err); } } }; /** * 將文章列表存入資料庫 * @param result * @param callback * @returns {Promise.<void>} */ const saveDB = async(result, callback) => { //console.log(result); let flag = await dbHelper.insertCollection(articleDbModel, result).catch(function (err){ logger.error('data insert falied'); }); if (!flag) { logger.error('news list save failed'); } else { logger.info('list saved!total:' + result.length); } if (typeof callback === 'function') { callback(true); } }; 複製程式碼
再來看抓取新聞內容的邏輯,這裡是直接根據新聞的sid得到新聞內容頁的html,然後利用cheerio庫分析獲取我們需要的新聞內容。當然這裡也是要把文章中的圖片爬下來存入伺服器,並且把存入資料庫的新聞內容中圖片連結替換成自己伺服器中的URL。
/** * 抓取正文程式入口 * @returns {Promise.<*>} */ const articleContentInit = async() => { logger.info('grabbing article contents starts...'); let uncachedArticleSidList = await getUncachedArticleList(articleDbModel); // console.log('未快取的文章:'+ uncachedArticleSidList.join(',')); const res = await batchCrawlArticleContent(uncachedArticleSidList); if (!res) { logger.error('grabbing article contents went wrong...'); } return res; }; /** * 查詢新聞列表獲取sid列表 * @param Model * @returns {Promise.<void>} */ const getUncachedArticleList = async(Model) => { const selectedArticleList = await dbHelper.queryDocList(Model).catch(function (err){ logger.error(err); }); return selectedArticleList.map(item => item.sid); // return selectedArticleList.map(item => item._doc.sid); }; /** * 批量抓取新聞詳情內容 * @param list * @returns {Promise} */ const batchCrawlArticleContent = (list) => { return new Promise((resolve, reject) => { async.mapLimit(list, 3, (sid, callback) => { getArticleContent(sid, callback); }, (err, result) => { if (err) { logger.error(err); reject(false); return; } resolve(true); }); }); }; /** * 抓取單篇文章內容 * @param sid * @param callback * @returns {Promise.<void>} */ const getArticleContent = async(sid, callback) => { let num = Math.random() * 1000 + 1000; await sleep(num); let url = contentBaseUrl + sid + '.htm'; request(url, (err, response, body) => { if (err) { logger.error('grabbing article content went wrong,article url:' + url); callback(null, null); return; } const $ = cheerio.load(body, { decodeEntities: false }); const serverAssetPath = `${serverIp}:${serverPort}/data`; let domainReg = new RegExp('https://static.cnbetacdn.com','g'); let article = { sid, source: $('.article-byline span a').html() || $('.article-byline span').html(), summary: $('.article-summ p').html(), content: $('.articleCont').html().replace(styleReg.reg, styleReg.replace).replace(scriptReg.reg, scriptReg.replace).replace(domainReg, serverAssetPath), }; saveContentToDB(article); let imgList = []; $('.articleCont img').each((index, dom) => { imgList.push(dom.attribs.src); }); downloadImgs(imgList); callback(null, null); }); }; /** * 下載圖片 * @param list */ const downloadImgs = (list) => { const host = 'https://static.cnbetacdn.com'; const basepath = './public/data'; if (!list.length) { return; } try { async.eachSeries(list, (item, callback) => { let num = Math.random() * 500 + 500; sleep(num); if (item.indexOf(host) === -1) return; let thumb_url = item.replace(host, ''); item.thumb = thumb_url; if (!fs.exists(thumb_url)) { mkDirs(basepath + thumb_url.substring(0, thumb_url.lastIndexOf('/')), () => { request .get({ url: host + thumb_url, }) .pipe(fs.createWriteStream(path.join(basepath, thumb_url))) .on("error", (err) => { console.log("pipe error", err); }); callback(null, null); }); } }); } catch(err) { console.log(err); } }; /** * 儲存到文章內容到資料庫 * @param article */ const saveContentToDB = (item) => { let flag = dbHelper.updateCollection(articleDbModel, item); if (flag) { logger.info('grabbing article content succeeded:' + item.sid); } }; 複製程式碼
爬蟲部分差不多就是這樣,還有一點就自己伺服器儲存的爬取的圖片每天都會有上百張,時間一長,圖片佔用的儲存空間就會特別大,所以需要定時清理一下,有興趣的可以看看專案裡面的clear-expire.js檔案。
總結
其實,雖然這個專案整體並不複雜,但是一套前後端系統搭建起來的過程中,自己的收穫還是挺不少的,很多問題的解決需要自己去實踐和思考的,對於效能優化考量也是一個重要的方面。 下面截圖就是我最終完成得m站,介面很清爽,體驗上確實比cnBeta官網要好很多。這樣是平時看科技新聞也確實方便很多。


以上