1. 程式人生 > 其它 >爬蟲學習筆記:Chrome開發者工具

爬蟲學習筆記:Chrome開發者工具

如何通過Chrome開發者工具尋找一個網站上特定資料的爬取方式。

一、檢視網頁原始碼

在網頁上右鍵,選擇 檢視網頁原始碼(Ctrl+U),可顯示URL對應的HTML程式碼文字。

內容與通過程式碼向URL傳送GET請求所得到的結果一致。

通過正則表示式、bs4、xpath等方式可以在文字內容中搜索需要的資料,進行提取。

對於非同步載入資料的網站,頁面無法搜尋得到。

或者因為許可權、驗證碼等限制,程式碼獲取得到結果與頁面顯示不同。

二、審查元素 F12

在網頁上右鍵,選擇 檢查、審查元素,可進入Chrome開發者工具中的元素選擇器。

Elements 標籤頁:

  • 選擇元素:滑鼠定位
  • 模擬器:模擬裝置效果
  • 程式碼區:HTML程式碼、選中元素對應路徑
  • 樣式區:CSS樣式

Elements 看到的程式碼不等於請求網址拿到的返回值

它是網頁經過瀏覽器渲染後得到的最終效果。

三、網路 Network

選擇 Network 進入網路監控功能,即“抓包”。

對於通過非同步請求獲取到的資料,找到其來源,包括:資料、JS、CSS、圖片、文件等。

點選“搜尋”功能,可直接對內容進行過濾。

抓取需要考慮幾個問題:

  • 請求方法:GET or POST
  • 請求附帶的引數資料:傳遞引數
  • Headers資訊:user-agent、host、referer、cookie等

Network 還有個功能:右鍵點選列表,選擇“Save as HAR with content

”,儲存到檔案。

這個檔案包含了列表中所有請求的各項引數及返回值資訊

四、資源 Sources

檢視資源列表和除錯 JS。

五、Console

顯示頁面的報錯和輸出,並且可以執行 JS 程式碼。

參考連結:爬蟲必備工具,掌握它就解決了一半的問題