Google Chrome抓包分析詳解

前言:因作LaGou網翻頁教程,頻繁訪問,導致IP被封,所以先來篇我們該如何抓包。

目標:學會利用Chrome瀏覽器的開發者工具進行HTTP請求分析


一:什么是抓包

即抓取我們本地電腦與遠端服務器通信時候所傳遞的數據包

二:Chrome瀏覽器講解

Chrome 開發者工具是一套內置于Google Chrome中的Web開發和調試工具,可用來對網站進行迭代、調試和分析

三:打開Chrome開發者工具

在Chrome界面按F12

or在頁面元素上右鍵點擊,選擇“檢查”

四:開發者工具的結構

Elements(元素面板):使用“元素”面板可以通過自由操縱DOM和CSS來重演您網站的布局和設計。

Console(控制臺面板):在開發期間,可以使用控制臺面板記錄診斷信息,或者使用它作為 shell,在頁面上與JavaScript交互

Sources(源代碼面板):在源代碼面板中設置斷點來調試 JavaScript ,或者通過Workspaces(工作區)連接本地文件來使用開發者工具的實時編輯器

Network(網絡面板):從發起網頁頁面請求Request后得到的各個請求資源信息(包括狀態、資源類型、大小、所用時間等),并可以根據這個進行網絡性能優化

Performance(性能面板):使用時間軸面板,可以通過記錄和查看網站生命周期內發生的各種事件來提高頁面運行時的性能

Memory(內存面板):分析web應用或者頁面的執行時間以及內存使用情況

Application(應用面板):記錄網站加載的所有資源信息,包括存儲數據(Local Storage、Session Storage、-IndexedDB、Web SQL、Cookies)、緩存數據、字體、圖片、腳本、樣式表等

Security(安全面板):使用安全面板調試混合內容問題,證書問題等等

Audits(審核面板):對當前網頁進行網絡利用情況、網頁性能方面的診斷,并給出一些優化建議。比如列出所有沒有用到的CSS文件等

五:重點講解Network

定義:Network 面板記錄頁面上每個網絡操作的相關信息,包括詳細的耗時數據、HTTP 請求與響應標頭和 Cookie

結構:由五個窗格組成,如圖

1:Controls(控件)?

使用這些選項可以控制 Network(網絡)面板的外觀和功能

2:Filters(過濾器)

使用這些選項可以控制在請求列表中顯示哪些資源

提示:按住Ctrl(Window / Linux),然后點擊過濾器可以同時選擇多個過濾器。

此外,篩選框可以實現很多定制化的篩選,比如字符串匹配,關鍵詞篩選等,其中關鍵詞篩選主要有如下幾種:?

domain:僅顯示來自指定域的資源。您可以使用通配符()來包括多個域。例如,.com顯示以.com結尾的所有域名中的資源。 DevTools會在自動完成下拉菜單中自動填充它遇到的所有域。

has-response-header:顯示包含指定HTTP響應頭信息的資源。 DevTools會在自動完成下拉菜單中自動填充它遇到的所有響應頭。

is:通過is:running找出WebSocket請求。

larger-than(大于):顯示大于指定大小的資源(以字節為單位)。設置值1000等效于設置值1k。

method(方法):顯示通過指定的HTTP方法類型檢索的資源。DevTools使用它遇到的所有HTTP方法填充下拉列表。

mime-type(mime類型:顯示指定MIME類型的資源。 DevTools使用它遇到的所有MIME類型填充下拉列表。

mixed-content(混合內容:顯示所有混合內容資源(mixed-content:all)或僅顯示當前顯示的內容(mixed-content:displayed)。

Scheme(協議):顯示通過不受保護的HTTP(scheme:http)或受保護的HTTPS(scheme:https)檢索的資源。

set-cookie-domain(cookie域):顯示具有Set-Cookie頭,并且其Domain屬性與指定值匹配的資源。DevTools會在自動完成下拉菜單中自動填充它遇到的所有Cookie域。

set-cookie-name(cookie名):顯示具有Set-Cookie頭,并且名稱與指定值匹配的資源。DevTools會在自動完成下拉菜單中自動填充它遇到的所有Cookie名。

set-cookie-value(cookie值):顯示具有Set-Cookie頭,并且值與指定值匹配的資源。DevTools會在自動完成下拉菜單中自動填充它遇到的所有cookie值。

status-code(狀態碼):僅顯示其HTTP狀態代碼與指定代碼匹配的資源。DevTools會在自動完成下拉菜單中自動填充它遇到的所有狀態碼。

3:Overview(概覽)

這個圖表顯示檢索資源的時間軸。如果您看到多個垂直堆疊的欄,這意味著這些資源被同時檢索。

4:Requests Table(請求列表)

此列表列出了檢索的每個資源。默認情況下,此表按時間順序排序,也就是最早的資源在頂部。單擊資源名稱可以獲得更多信息。提示:右鍵單擊列表的任何標題欄可以以添加或刪除信息列。

查看單個資源的詳細信息

點擊資源名稱(位于 Requests Table 的 Name 列下)可以查看與該資源有關的更多信息。?

可用標簽會因您所選擇資源類型的不同而不同,但下面四個標簽最常見:

Headers:與資源關聯的 HTTP 標頭。

Preview:JSON、圖像和文本資源的預覽。

Response:HTTP 響應數據(如果存在)。

Timing:資源請求生命周期的精細分解。

Headers(查看 HTTP 標頭)?

點擊?Headers?可以顯示該資源的標頭。?

Headers?標簽可以顯示資源的請求網址、HTTP 方法以及響應狀態代碼。 此外,該標簽還會列出 HTTP 響應和請求標頭、它們的值以及任何查詢字符串參數

點擊每一部分旁邊的?view source?或?view parsed?鏈接,您能夠以源格式或者解析格式查看響應標頭、請求標頭或者查詢字符串參數。

Preview(預覽資源)?

點擊Preview標簽可以查看該資源的預覽。Preview標簽可能顯示一些有用的信息,也可能不顯示,具體取決于您所選擇資源的類型。![|center|600*0(./1510193933148.png)

Response(查看 HTTP 響應內容)

點擊 Response 標簽可以查看資源未格式化的 HTTP 響應內容。 Preview 標簽可能包含一些有用的信息,也可能不包含,具體取決于您所選擇資源的類型。

查看 Cookie

點擊 Cookies 標簽可以查看在資源的 HTTP 請求和響應標頭中傳輸的 Cookie 表。 只有傳輸 Cookie 時,此標簽才可用。

下面是 Cookie 表中每一列的說明:

Name:Cookie 的名稱。

Value:Cookie 的值。

Domain:Cookie 所屬的域。

Path:Cookie 來源的網址路徑。

Expires / Max-Age:Cookie 的 expires 或 max-age 屬性的值。

Size:Cookie 的大小(以字節為單位)。

HTTP:指示 Cookie 應僅由瀏覽器在 HTTP 請求中設置,而無法通過 JavaScript 訪問。

Secure:如果存在此屬性,則指示 Cookie 應僅通過安全連接傳輸。

復制、保存和清除網絡信息

右鍵單擊Requests Table請求列表)以復制、保存或刪除網絡信息。一些選項是上下文相關的,所以如果想在單個資源上操作,需要右鍵單擊該資源行。下面的列表描述了每個選項

Copy Response(復制響應)

將所選資源的HTTP響應復制到系統剪貼板。

Copy as cURL(復制為cURL)

將所選資源的網絡請求作為cURL命令字符串復制到系統剪貼板。 請參閱將復制請求為cURL命令。

curl命令是一個利用URL規則在命令行下工作的文件傳輸工具。它支持文件的上傳和下載,所以是綜合傳輸工具,但按傳統,習慣稱curl為下載工具。作為一款強力工具,curl支持包括HTTP、HTTPS、ftp等眾多協議,還支持POST、cookies、認證、從指定偏移處下載部分文件、用戶代理字符串、限速、文件大小、進度條等特征。做網頁處理流程和數據檢索自動化,curl可以祝一臂之力。l

Copy All as HAR(全部復制為HAR)

將所有資源復制到系統剪貼板作為HAR數據。 HAR文件包含描述網絡“瀑布”的JSON數據結構。一些第三方工具可以使用HAR文件中的數據重建網絡瀑布。有關詳細信息,請參閱Web性能強大工具:HTTP歸檔(HAR)。

Save as HAR with Content(另存為帶內容的HAR)

將所有網絡數據與每個頁面資源一起保存到HAR文件中。 二進制資源(包括圖像)被編碼為Base64編碼文本。

Clear Browser Cache(清除瀏覽器緩存)

清除瀏覽器高速緩存。提示:您也可以從Network Conditions(網絡條件)抽屜式窗格中啟用或禁用瀏覽器緩存。

Clear Browser Cookies(清除瀏覽器Cookie)

清除瀏覽器的Cookie。

Open in Sources Panel(在源文件面板中打開)

在Sources(源文件)面板中打開選定的資源。

Open Link in New Tab(在新標簽頁中打開鏈接)

在新標簽頁中打開所選資源。您還可以在Requests Table(請求列表)中雙擊資源名稱。

Copy Link Address(復制鏈接地址)

將資源URL復制到系統剪貼板。

Save(保存)

保存所選的文本資源。僅顯示在文本資源上。

Replay XHR(重新發送XHR)

重新發送所選的XMLHTTPRequest。僅顯示在XHR資源上。

查看資源發起者和依賴關系

按住Shift并移動鼠標到資源上可查看它的發起者和依賴關系。這部分是你鼠標懸停的資源的target(目標)引用。

從target(目標)往上查找,第一個顏色編碼為綠色的資源是target(目標)的發起者。如果存在第二個顏色編碼為綠色資源,那么這個是發起者的發起者。從target(目標)向下查找,任何顏色編碼為紅色的資源都是target的依賴。

大家可以看下之前案例的抓包\

異步加載的抓包一般都在XHR,JS中

現在學習Tor代理服務器,來解決IP被封問題,歡迎大家一起來學習

本系列文章同步跟新于微信公眾號工科男雷先生。知乎:雷之

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,739評論 6 534
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,634評論 3 419
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,653評論 0 377
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,063評論 1 314
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,835評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,235評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,315評論 3 442
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,459評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,000評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,819評論 3 355
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,004評論 1 370
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,560評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,257評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,676評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,937評論 1 288
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,717評論 3 393
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,003評論 2 374

推薦閱讀更多精彩內容

  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,786評論 18 139
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,666評論 25 708
  • 在做前端開發時,我們需要用到一些調試工具用來調試我們的HTML、CSS或者JS代碼,俗話說預先善其事必先利其器,這...
    Rella7閱讀 24,008評論 0 15
  • API定義規范 本規范設計基于如下使用場景: 請求頻率不是非常高:如果產品的使用周期內請求頻率非常高,建議使用雙通...
    有涯逐無涯閱讀 2,575評論 0 6
  • 文\余興 事先說明,以下內容不是廣告,羅輯思維還不屑找我這種小號做廣告,哈哈~~ 昨天羅胖在得到里上線了最新的訂閱...
    余無忌閱讀 607評論 5 4