廖雨寒 楊彥松 張斌
一、背景
隨著網(wǎng)絡(luò)的迅速發(fā)展,萬維網(wǎng)成為大量信息的載體,如何有效地提取并利用這些信息成為一個(gè)巨大的挑戰(zhàn),網(wǎng)絡(luò)爬蟲(web crawler)隨之而生。但是現(xiàn)在的網(wǎng)站很少有純靜態(tài)網(wǎng)頁,大部分網(wǎng)站都通過JavaScript渲染、ajax異步等實(shí)現(xiàn)網(wǎng)頁數(shù)據(jù)加載。對于目前的爬蟲框架來說,基本都是爬取到的未渲染過的HTML源碼,所以對于爬蟲來說沒真正做到瀏覽器的所見即所爬。對于scrapy來說,官方有一個(gè)scrapy-splash項(xiàng)目支持頁面渲染解析,然而scrapy-splash在高并發(fā)狀態(tài)下極其不穩(wěn)定。一種方案是通過webkit瀏覽器引擎直接渲染,另一種方案是通過調(diào)用瀏覽器渲染。通過幾種方案比較,最終選擇了Google Chrome Devtools Protocol開發(fā)渲染功能。
二、渲染方案可行性分析
1.Scrapy-Splash
Scrapy-splash是scrapy官方團(tuán)隊(duì)提供的一個(gè)解決js渲染問題的方案。Splash是處理網(wǎng)頁渲染的模塊,它內(nèi)部使用的開源的webkit瀏覽器引擎,通過HTTP API來使用渲染服務(wù)。在scrapy中通過DownloaderMiddleware處理網(wǎng)頁請求,實(shí)際是去請求splash接口并得到渲染后的數(shù)據(jù)。
Splash優(yōu)點(diǎn):
可以并行處理多個(gè)網(wǎng)頁
獲取HTML結(jié)果和/或截取屏幕截圖
關(guān)掉加載圖片或使用 Adblock Plus規(guī)則使得渲染速度更快
使用JavaScript處理網(wǎng)頁內(nèi)容
使用Lua腳本
能夠獲得具體的HAR格式的渲染信息
然而在實(shí)際使用scrapy-splash的過程中,也遇到過一些splash的問題:
對于一些特殊網(wǎng)站,并不能很好的處理重定向,比如一些需要通過js渲染Cookie的頁面,需要通過location對象重定向好幾次才能到真正的頁面,但是splash只是處理了第一次的渲染Cookie后并沒有實(shí)現(xiàn)跳轉(zhuǎn)
在并發(fā)的情況下,獲取到的數(shù)據(jù)有時(shí)候是沒有內(nèi)容的
2.Scrapy-QtWebkit
Splash是采用Webkit引擎實(shí)現(xiàn)的網(wǎng)頁渲染,可直接采用Webkit對接Scrapy實(shí)現(xiàn)渲染網(wǎng)頁。在Qt庫中有相應(yīng)的QtWebkit模塊,但是在Qt5.6版本以上QtWebkit就被淘汰了,代替它的是QtWebEngine,因此,選擇QtWebKit時(shí),建議使用Qt4或者Qt5.6之前的版本。
Webkit大致通過View-->Page-->Frame的流程來加載網(wǎng)頁。通過這些模塊,對于上面splash遇到重定向問題和空頁面問題都能得到解決。
Webkit優(yōu)點(diǎn):
細(xì)粒度處理網(wǎng)頁渲染
資源加載可控
直接交與webkit處理更效率
Webkit缺點(diǎn):
內(nèi)存資源占用較大
高并發(fā)處理網(wǎng)頁過多容易引起C底層錯(cuò)誤
三、Google Chrome Devtools Protocol
以上兩種方案,都存在各自的缺點(diǎn), 那有沒有可能直接通過調(diào)用瀏覽器加載網(wǎng)頁呢?事實(shí)上selenium可以操作瀏覽器。selenium操作chrome是使用chromedriver,chromedriver底層應(yīng)用的是Chrome Devtools Protocol,因此,何不直接使用Chrome Devtools Protocol。
Chrome Devtools Protocol介紹
在Chrome/Chromium瀏覽器中,按F12會彈出調(diào)試工具,它是通過Chrome Devtools Protocol的協(xié)議來進(jìn)行數(shù)據(jù)通訊。Chrome Devtools Protocol用來與瀏覽器頁面(pages)交互和調(diào)試的協(xié)議通道。它采用websocket來與頁面建立通信通道,由發(fā)送給頁面的Commands和它所產(chǎn)生的Events組成。
在Chrome Devtools Protocol中,有很多不同的功能模塊域(domains),類似于Chrome開發(fā)這工具的個(gè)功能模塊。
然而對于此例的爬蟲來說,只需要用到Network,Page,Runtime等幾個(gè)功能模塊域:
Network允許跟蹤頁面的網(wǎng)絡(luò)活動(dòng),它公開http, file, data,網(wǎng)絡(luò)請求和響應(yīng)等數(shù)據(jù)信息
Page會檢查與頁面相關(guān)的動(dòng)作和事件
Runtime主要用作運(yùn)行JavaScript操作代碼
啟動(dòng)調(diào)試實(shí)例
要使用Chrome Devtools Protocol,需要開啟調(diào)試。我們的項(xiàng)目運(yùn)行在服務(wù)器中,所以需要開啟無頭模式 --h(huán)eadless --disable-gpu --no-sandbox。
chrome.exe --remote-debugging-port=9222 --h(huán)eadless --disable-gpu --no-sandbox
如果需要遠(yuǎn)程調(diào)試,可以加上參數(shù)--remote-debugging-address='0.0.0.0'。
操作Chrome Devtools Protocol
通過以上命令可以啟動(dòng)一個(gè)Chrome調(diào)試實(shí)例,通過HTTP調(diào)用接口:
http://loacalhost:9222/json
會得到接口返回的JSON數(shù)據(jù):
[
{
"description": "",
"devtoolsFrontendUrl": "/devtools/inspector.html?ws=localhost:9222/devtools/page/A6C1F7B23DFF222A87143ACB37CBF7C4",
"id": "A6C1F7B23DFF222A87143ACB37CBF7C4",
"title": "about:blank",
"type": "page",
"url": "about:blank",
"webSocketDebuggerUrl": "ws://localhost:9222/devtools/page/A6C1F7B23DFF222A87143ACB37CBF7C4"
}
]
默認(rèn)開啟實(shí)例后會有一個(gè)空的標(biāo)簽頁(Tab),要?jiǎng)?chuàng)建新的Tab,只需要通過調(diào)用接口
http://loacalhost:9222/json/new
或者在后面直接添加網(wǎng)址,Tab將會創(chuàng)建并加載網(wǎng)頁
http://loacalhost:9222/json/new?http://www.example.com/
在每個(gè)Tab中有一個(gè)webSocketDebuggerUrl字段,它提供了一個(gè)WebSocket接口與Chrome交互。比如要啟用Page模塊域,通過WebSocket發(fā)送以下命令開啟:
{"id":1, "method":"Page.enable", "params":{}}
關(guān)閉Tab
http://loacalhost:9222/json/close/A6C1F7B23DFF222A87143ACB37CBF7C4
四、Scrapy實(shí)現(xiàn)Chrome Protocol下載渲染頁面
Scrapy是一個(gè)爬蟲框架,它使用了Twisted異步網(wǎng)絡(luò)庫來處理網(wǎng)絡(luò)通訊,他的大致架構(gòu)流程如圖
圖 1 Scrapy框架
在圖1中我們看到scrapy處理網(wǎng)絡(luò)請求的是Downloader模塊,他通過DownloaderHandler下載處理器完成下載網(wǎng)絡(luò)請求,下載處理器使用的是Twisted網(wǎng)絡(luò)庫實(shí)現(xiàn)的,對于Chrome Protocol來說我們通過接口操作命令實(shí)現(xiàn)網(wǎng)頁加載本質(zhì)上是Chrome加載網(wǎng)頁,也就是說下載處理是通過Chrome Protocol接口操作Chrome瀏覽器請求加載并渲染網(wǎng)頁,因此我們需要拿到渲染后的網(wǎng)頁HTML源碼,需要改寫DownloaderHandler。
然而原生操作Chrome Protocol太繁瑣,我們需要封裝它。在Github上有多種語言實(shí)現(xiàn)了Chrome Devtools Protocol的封裝。對于Python來說,我們使用Pychrome庫來操作Chrome Protocol,可以直接用pip安裝模塊:
pip install pychrome
當(dāng)然要使用該模塊得要啟動(dòng)Chrome調(diào)試實(shí)例,通過實(shí)例的地址和端口號連接:
browser = pychrome.Browser(url="http://<your_ip>:9222")
通過new_tab()方法創(chuàng)建tab標(biāo)簽頁,通過tab.start()啟動(dòng)當(dāng)前tab的websocket鏈接,例如需要啟動(dòng)Network功能域,通過調(diào)用tab.Network.enable()來啟動(dòng),通過tab.Page.navigate(url="http://www.example.com")加載網(wǎng)頁,該頁面加載時(shí)的一切網(wǎng)絡(luò)活動(dòng)都可以通過接收websocket響應(yīng)得到j(luò)son數(shù)據(jù)。
這時(shí)會有一個(gè)問題,何時(shí)才算是真正渲染完成頁面?
圖 2 JS渲染流程
在圖2中是瀏覽器從輸入網(wǎng)址到頁面加載完成的處理流程,loadEventEnd是真正加載完成,但是在一些使用ajax異步請求的網(wǎng)頁使用loadEventEnd并不能很好的判斷為渲染結(jié)束,所以這里我們使用JavaScript命令獲取readyState狀態(tài)判斷頁面是否加載完成:
document.readyState
readyState一共有五種狀態(tài):
uninitialized - XML 對象被產(chǎn)生,但沒有任何文件被加載
loading - 加載程序進(jìn)行中,但文件尚未開始解析
loaded - 部分的文件已經(jīng)加載且進(jìn)行解析,但對象模型尚未生效
interactive - 僅對已加載的部分文件有效,在此情況下,對象模型是有效但只讀的
complete - 文件已完全加載,代表加載成功
通過document.readyState == complate來判斷數(shù)據(jù)的加載進(jìn)度。當(dāng)加載完成時(shí)通過javascript命令獲取渲染后的HTML源碼:
document.documentElement.outerHTML
在這里我們就可以使用Pychrome替代scrapy的twisted下載處理。
五、結(jié)語
使用chrome devtools protocol來操作chrome瀏覽器來渲染頁面,能基本完成渲染頁面的需求,一些需要與瀏覽器交互的頁面也大致能使用JavaScript操作命令,重點(diǎn)是使用chrome操作頁面渲染會很占用資源,因此不宜過多的開啟渲染進(jìn)程,多線程下載盡量重用Tab標(biāo)簽頁,因?yàn)槊慷鄤?chuàng)建一個(gè)Tab相當(dāng)于開了一個(gè)進(jìn)程,最后,爬蟲結(jié)束時(shí),應(yīng)該調(diào)用相關(guān)接口關(guān)閉所有Tab,釋放資源。
-
javascript
+關(guān)注
關(guān)注
0文章
515瀏覽量
53717 -
應(yīng)用軟件
+關(guān)注
關(guān)注
0文章
49瀏覽量
9067
發(fā)布評論請先 登錄
相關(guān)推薦
評論