(1)、為何需要進行HTTP請求分析
答:方便我們編寫的爬蟲精准定位爬取目標
(2)、知識儲備
1、什么是抓包?
抓包:抓取客戶端與服務器之間進行通信時產生的數據包
2、了解抓包工具:chrome下的開發者模式,使用F12即可打開
功能結構分析:(參考文檔:http://www.css88.com/doc/chrome-devtools/)
Elements(元素面板):用於查看網頁源代碼HTML中的任一元素,手動修改任一元素的屬性和樣式且能在瀏覽器中得到實時反饋
Console(控制台面板):在開發過程中,記錄診斷信息,或用來作為shell在頁面中與javascript進行交互
Source(源代碼面板):斷點調試javascript,或通過Workspaces(工作區)連接本地文件來使用開發者工具的實時編輯器
Network(網路面板):從發起頁面請求Request后分析HTTP請求后得到的各個請求資源信息(包括狀態、資源類型、大小、所用時間等)
Performance(性能面板):使用時間軸面板通過記錄和查看網站生命周期內發生的各種事件來提高頁面的運行性能
Memory(內存面板):分析web應用或頁面的執行時間及內存使用情況
Application(應用面板):記錄網站加載的所有資源信息,包括存儲數據(local storage session storage -lndexedDB web SQL Cookies)緩存數據、字體、圖片、腳本、樣式表等
Security(安全面板):用來調試混合內容問題、證書問題等
Audits(審核面板):對當前網頁進行網絡利用情況、網頁性能方面的診斷,並給出優化建議,例如列出所有沒有用到的CSS文件等
(3)、主要面板使用詳解
Elements(元素面板)--相當於在源碼與渲染好的頁面間搭建的橋梁,直觀的看到你要抓取的數據(當我們在頁面中右擊找二手房后並選取檢查后,會在element中定位相應的源碼)
Console(控制台面板)--注入js代碼用於操作瀏覽器干活
運行后我們成功打開了淘寶頁面
Network(網路面板)
1、Controls(控件):用來控制Network面板的外觀和功能
2、Filters(過濾器):用來篩選請求列表中顯示哪些資源(注:windows/linux中按住ctrl,可選多個過濾器、Mac中則按住Cmd)
3、Overview(概覽):用來記錄每個鏈接何時開始加載、何時加載完畢
4、Request Table(請求列表):展示了每一個鏈接的請求(默認按時間排序)
5、Summary(概要):展示請求總數、傳輸的數據量和加載時間
備注:使用ctrl +shift +n 進入無痕模式進行抓包
1、controls:
說明:禁用緩存:現代瀏覽器的智能化決定了當你刷新頁面時,其實只刷新了一部分內容(從服務器返回)而另一部分從本機的緩存中調用,而勾選這個選項表明刷新全部內容(即全從服務器返回)--能更加真實的了解服務器返回的內容
2、filter:
使用過濾器:
關鍵字查詢:
1、domain(域)
顯示指定域的資源。例子:*.com顯示.com結尾的域名中的資源
2、has-response-header(響應頭信息)
顯示指定http響應頭的信息資源。
3、ls
使用is:running過濾出WebSocket資源
4、langer-than(大於)
顯示大於指定大小的資源(已bytes為單位),設置值1000等效於設置值1k。
5、method(方法)
顯示通過指定http方法檢索的資源。
6、mime-type(mine類型)
顯示指定mine類型的資源。
7、mixed-content(混合內容)
顯示所有混合內容的資源(mixed-content:all)\ 顯示當前顯示的內容(mixed-content:displayed)
8、scheme(協議)
顯示通過不受保護的http(scheme:http)或受保護的https(scheme:https)檢索的資源
這里補充一個小知識點:https是在http基礎上有SSL,其中包含CA證書
9、set-cookie-domain(cookie域)
顯示具有Set-Cookie頭且domain屬性與指定值匹配的資源。
10、set-cookie-name(cookie名)
顯示具有Set-Cookie頭且名稱與指定值匹配的資源。
11、set-cookie-value(cookie值)
顯示具有Set-Cookie頭且值與指定資源匹配的資源。
12、status-code(狀態嗎)
顯示http狀態碼與指定代碼匹配的資源
這里補充一個小知識點:2---表示成功 3-- 表示重定向 4--服務器出錯 5-- 客戶端出錯
實驗:
復制、保存、清除網絡信息:
查看資源發起者和依賴者的關系(類比為:母子)