Web Scraper 獲取網頁數據，秒殺八爪魚
對于文科生來說，系統學習python爬蟲的話時間成本太高，有沒有簡單的爬蟲軟件呢？
當然有，現在市面上最流行的八爪魚采集器、后羿采集器等，就是相對簡單的爬蟲軟件。不過，這些都不算最好用，可以爬取的網站有限，而且下載軟件和學習軟件也很麻煩。
今天，程序猿給大家介紹一款Google瀏覽器插件——Web Scraper，作為插件的它非常方便使用，爬取的內容質量一點也不輸八爪魚。話不多說，安裝插件，一睹為快吧！
演示環境：Win10-64bit，Google Chrome
安裝Web Scraper
進入Chrome 應用商店，選擇在線安裝；
-
如果下載時連接不上，也可以離線安裝：
訪問 www.gugeapps.net 這個國內瀏覽器插件網站，搜索 Web Scraper，下載插件壓縮包到本地；(也可以公眾號后臺回復Web Scraper獲取安裝包)
將安裝包解壓縮；
打開支持 Chrome協議的瀏覽器（首選Google 瀏覽器），網址框輸入 chrome://extensions/ ，點擊"加載已解壓的擴展程序"，選擇解壓的文件夾，將其導入瀏覽器插件中。
如果如下顯示，即為安裝成功。（錯誤可不用理會）
Web Scraper的基本原理和python爬蟲相似，學會了爬蟲，這些也都相應比較熟悉。這次數據猿公布兩個案例，一個是爬取拉勾網的職位數據，一個是豆瓣電影評分Top250。前者在沒有抓包的情況下不能實現翻頁，后者可以通過理解url來來修改start_url以實現翻頁。
案例一：爬取拉勾網職位
啟動Web Scraper
打開目標網頁
最近，正值找實習找工作的關頭，數據猿想要知道全國招聘產品策劃實習的情況。所以就上了拉勾網，限定檢索關鍵詞為產品策劃，工作性質為實習。
找到Web Scraper菜單欄
按F12，查看網頁代碼。如果代碼和網頁是左右結構，請點擊如下圖所示的右上角，將左右結構換為上下結構。
就可以看到Web Scraper菜單欄了！
設置爬取起始網頁
創建sitemap
填寫sitemap的名稱和start_url，名稱可以自己擬定，起始頁建議根據檢索后結果后的第二頁來定。
<pre spellcheck="false" class="md-fences md-end-block ty-contain-cm modeLoaded" lang="python" cid="n45" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(34, 34, 27); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 2px 4px 0px; color: rgb(152, 159, 173); width: inherit; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">第2頁
https://www.lagou.com/jobs/list_%E4%BA%A7%E5%93%81%E7%AD%96%E5%88%92?px=default&gx=%E5%AE%9E%E4%B9%A0&city=%E5%85%A8%E5%9B%BD&isSchoolJob=1#order
第3頁
https://www.lagou.com/jobs/list_%E4%BA%A7%E5%93%81%E7%AD%96%E5%88%92?px=default&gx=%E5%AE%9E%E4%B9%A0&city=%E5%85%A8%E5%9B%BD&isSchoolJob=1#order
</pre>
這里通過觀察發現，第2和第3頁的網址完全一樣，如上代碼行所示。所以想要實現翻頁效果的話，就需要采用抓包工具，抓取真實的url，這里暫不演示。
添加父級selector
在創建成功sitemap后（其實就類似于一個爬蟲項目），添加selector，成為選擇器吧，如果吧sitemap理解為第一文件夾，那么selector就是第二級文件，當然，可以是文件夾也可以是文件。
點擊圈紅的按鈕
設置selector的ID和type
這里我們打算選擇這一頁的職位名稱，然后點擊進入職位名稱后篩選信息，所以共需要兩級selector，父級需要選中這些職位名稱，并選中link（鏈接）以跳轉到子級頁面。
選擇頁面中的內容
按照下圖步驟，先選中multiple（因為這里是多選），然后點擊select，再點擊選中要爬取的名稱，注意這里點擊兩個或者三個名稱即可自動識別，然后點擊Done selecting，確定選擇這些，再點擊Data preview預覽數據。
其他不需操作即可完成這個父級selector的爬取。
添加子級selector
打開需要爬取的二級網頁。同樣在二級頁面中，如果新打開了鏈接，就如上文所示調出Web Scraper，找到創建的sitemap。
添加新的selector
點擊父selector，進入父級selector中（點擊selector的任意位置可進入其子級），如法炮制，添加新的selector作為子級selector。
如上圖，數據猿在這里爬取實習薪資，格式是文本，所以type選text，然后不多選。
添加其他selector
這里就不需要進入實習薪資salary的子級了，其他數據和實習薪資salary是同級，所以就在同一級添加其他selector。
添加步驟和之前的一樣，數據猿還選中了公司名稱、公司規模、職位誘惑等數據。
如果需要修改，可以點擊selector左側的edit按鈕修改。
開始爬取
直接選擇本sitemap菜單欄下的Scrape
設置爬蟲頁面間隔時間（單位：毫秒），以免被封IP。不過這里的數據較少，可以設置1000,毫秒。
然后點擊開始爬取。在爬取過程中會彈出新的網頁，靜待數據爬取即可。
保存所爬數據
點擊本sitemap，然后選擇導出為csv
在新的Web Scraper窗口中點擊 Download now! 立即下載csv，保存到本地即可打開查看。
打開csv，發現最后得到的數據還比較整齊，薪資、城市、公司、公司規模可以簡單清洗一下放到pandas里面可視化了。
案例二：豆瓣電影評分top250
找工作太苦逼，趕快刷電影來放松一下。作為電影迷的數據猿，很想知道還有哪些高分電影沒有看過。這時候，Web Scraper就是一個非常方便的工具了，畢竟不用麻煩的寫代碼。
如上面案例，找到目標頁面，建立一個sitemap，并且同樣是包括一個父selector來獲取名稱和鏈接，多個子selector來獲取詳細的數據。
具體設置過程不再演示，重點說明一下翻頁功能的實現。
案例一拉勾網的網頁翻頁之后網址不變，而豆瓣的網頁會隨著翻頁而變化，而且變化是有規律的，這就給了我們翻頁功能的實現提供了便利。
尋找翻頁的規律
我們將第2頁和第3頁的網址列出來找規律（第1頁的網址一般沒有什么規律，建議從第2頁開始找），發現start=后面有規律，都是遞增25的。而刪掉&后面的網址不影響結果。
<pre mdtype="fences" cid="n179" lang="python" class="md-fences md-end-block ty-contain-cm modeLoaded" spellcheck="false" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(34, 34, 27); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 2px 4px 0px; color: rgb(152, 159, 173); width: inherit; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">第2頁
https://movie.douban.com/top250?start=25&filter=
第3頁
https://movie.douban.com/top250?start=50&filter=</pre>
所以這時候，Web Scraper就提供了解決方案，將start=后面加個[]，數據分別為0-終點數據，間隔為25。
<pre mdtype="fences" cid="n187" lang="python" class="md-fences md-end-block ty-contain-cm modeLoaded" spellcheck="false" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(34, 34, 27); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 2px 4px 0px; color: rgb(152, 159, 173); width: inherit; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">https://movie.douban.com/top250?start=[0-249:25]</pre>
最后，我們還可以保存我們的sitemap到本地。
下次使用的時候，直接在創建sitemap的窗口選擇import，將sitemap代碼粘貼進去即可。
最后獲取的數據如下
小結
Web Scraper對沒有python爬蟲基礎的同學非常友好，簡單易上手，可以自定義的采集方式非常便利，極大地減輕了后面數據清洗的壓力，同時，作為插件的它很輕便，還完全免費。但不足之處也很明顯，抓取網頁需要翻頁的時候，就要考抓包獲取真實網址，但這也是一般采集器的缺陷（要啥自行車）。
如果需要本文演示的sitemap和Web Scraper離線包，請到文科數據員公眾號后臺回復Web Scraper
參考資料
