使用Chrome快速實現數據的抓取（一）——概述

對於一些簡單的網頁，我們可以非常容易的通過Develop Tool來獲取其請求報文規律，並仿照其構建報文來獲取頁面信息。但是，隨着網頁越來越復雜，許多頁面是由js動態渲染生成的。要獲取這類信息，則需要蜘蛛程序模擬js渲染過程，此時必須研究其js腳本才能完成信息的獲取。

雖然從理論上來講，任何瀏覽器能獲取到的信息，我們完全可以編寫爬蟲來獲取到。但是而這個分析過程往往並不是一個比較麻煩的過程，往往存在如下困難：

• 逆向分析js費時費力，
• 許多爬蟲作者並不是前端工程師，效率不高
• 開發階段容易分析不全，使用時再改開銷很大
• 許多信息需要登陸，點擊等操作才能獲取到，爬蟲模擬這些行為比較費勁
• 爬蟲容易被網站屏蔽

對於動態網頁，一種策略是：首先通過瀏覽器訪問目標網頁，由瀏覽器完成解析后生成渲染后的Html文件，再由蜘蛛程序解析渲染后的Html文件。這樣就非常方便的解決的前面遇到的大多數問題了。

要實現這個操作，則需要一個能與應用程序交互的類瀏覽器軟件。網上看到的文章大多數是介紹通過phantomjs完成這一過程，不過用過它的人估計都會對它吐槽不已的，這里我這里就不一一列舉了，感興趣的朋友可以看看別人的吐槽：讓人歡喜讓我憂的phantomjs。

后來，發現Chrome本身也是可以通過遠程調試協議實現與應用程序交互的，並且功能更加強大，從此果斷的切換到了Chrome，使用它作為動態網頁的渲染器，本文這里對使用Chrome的優越性並不想做太多介紹，主要介紹如何使用它。

啟動Chrome

要使得Chrome支持與應用程序交互，首先需要指定遠程調試端口：

chrome.exe --remote-debugging-port=9222

• 如果要指定緩存位置，可以添加啟動參數：--user-data-dir=r:\cache
• 如果要使用無GUI模式（Headless），則需要添加參數： --disable-gpu --headless

注： Headless 模式目前尚還沒有正式完善，目前的情況是：

1. --headless在Linux的Chrome59中支持，Windows 的在chrome 60中支持
2. --disable-gpu參數在未來可能不需要，

作為爬蟲來說，使用Headless的方式可能更為常見，不過，在學習和開發的過程中，往往還是帶着GUI的方式跟為方便些的。這里就使用帶GUI的方式啟動Chrome。

標簽管理

啟動后，我們就可以在程序中通過socket的方式實現和chrome的交互了。Chrome Debug API包括兩個部分：標簽管理和頁面管理。首先我們介紹標簽管理部分，它是Rest形式的API接口，我們可以通過瀏覽器進行協議的模擬。

首先用瀏覽器打開 http://127.0.0.1:9222/json，這是當前所有標簽的list接口，可以看到如下接口數據：

[
    {
        "description": "",
        "devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/6d4f925f-7220-47cd-a4f9-800686445ffb",
        "faviconUrl": "http://tianfang.cnblogs.com/favicon.ico",
        "id": "6d4f925f-7220-47cd-a4f9-800686445ffb",
        "title": "天方 - 博客園",
        "type": "page",
        "url": "http://tianfang.cnblogs.com/",
        "webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/6d4f925f-7220-47cd-a4f9-800686445ffb"
    },
    {
        "description": "",
        "devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/92615aad-5862-48d5-983d-248468e9741a",
        "id": "92615aad-5862-48d5-983d-248468e9741a",
        "title": "Worker pid:6008",
        "type": "service_worker",
        "url": "https://www.google.com/_/chrome/newtab-serviceworker.js",
        "webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/92615aad-5862-48d5-983d-248468e9741a"
    }
]

相信大部分人從這個頁面中就可以它的基本信息，這里仍然簡單的介紹一下：

• Id：頁面的id信息
• devtoolsFrontendUrl：開發工具Url，可以通過chrome訪問這個url來實現內置的調試工具訪問
• type：當前進程的類型，只有類型為page的才是瀏覽器頁面，其余類型的是后台背景進程，我們不需要操作這類對象
• url：當前頁面訪問的地址
• webSocketDebuggerUrl：當前頁面的調試接口地址

實際上，chrome本身也內置了一個訪問調試協議的工具，我們可以直接通過http://127.0.0.1:9222來使用它。

除此之外，常見的訪問命令如下：

• http://127.0.0.1:9222/json  ：查看已經打開的Tab列表
• http://127.0.0.1:9222/json/version  : 查看瀏覽器版本信息
• http://127.0.0.1:9222/json/new?http://www.baidu.com  : 新開Tab打開指定地址
• http://127.0.0.1:9222/json/close/92615aad-5862-48d5-983d-248468e9741a  : 關閉指定Id的Tab頁面
• http://127.0.0.1:9222/json/activate/92615aad-5862-48d5-983d-248468e9741a  : 切換到指定Id的Tab頁面

 

頁面操作

前面的API只能做到簡單的打開，關閉標簽操作，我么往往還需要對頁面進行更詳細的操作，由於篇幅所限，本文了先介紹到這里，關於頁面操作的方式，在后續文章中再做跟進一步的介紹。