前端工程師用什麼工具扒網站？

---

如果題主說的是爬蟲，一般來說我們需要這 3 類工具

• 頁面請求工具
• 頁面處理工具
• 請求代理監控工具

筆者主要做web前端開發，因此主要介紹 JS 中常見的工具。

一、頁面請求工具

本質上這些工具都是一個 網路資源請求 工具。NodeJS 技術棧中，常見的工具有

1. request

最基礎的請求庫，提供鏈式語法的 API，喜歡 Promise 的可以試試 request-promise 官方Github 地址

var request = require("request");
request("https://www.zhihu.com", function(error, response, body) {
console.log("body:", body); // Print the HTML
});


2. superagent

原生支持 Node 環境和瀏覽器環境，提供鏈式語法和 Promise 語法的 API，周邊插件也很豐富 官方Github 地址

// Node環境中
const superagent = require("superagent");
superagent
.get("https://www.zhihu.com") // 請求地址
.query({ user: "liukanshan" }) // 請求頁面或介面的參數
.end((err, res) =&> {
// res是返回體，res.text就是html文本，更多查看官方文檔
});


二、頁面處理工具

抓取到的頁面一般是個字元串（`&< html &>...&< html &>"），想要 讀取裡面的數據，比如獲取導航欄菜單的名稱，一般會用到頁面模擬工具，常見的工具有

1. cheerio

類 JQuey 設計的服務端頁面運行環境，以上面 request 請求到頁面後為例 官方Github 地址

var request = require("request");
var cheerio = require("cheerio");
request("https://www.zhihu.com", function(error, response, body) {
var $ = cheerio.load(body);
console.log($(".Tabs-link.AppHeader-TabsLink").text); // 列印出 首頁
});


2. puppeteer

以 Chromium 為基礎開發的 Node 端無頭瀏覽器，最近幾年比較火，非常強大，非常強大，非常強大（說三遍～）官方Github 地址

const puppeteer = require("puppeteer");
(async () =&> {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto("https://zhihu.com");
await page.screenshot({ path: "知乎首頁截圖列印成圖片.png" });
await browser.close();
})();


三、抓取代理工具

我們在調試 「抓取網頁」 這個過程時，需要經常查看我們發出的請求對不對，返回是否有異常等，這時候需要代理工具能查看網路請求和返回

whistle

基於 NodeJS 開發網路代理工具

詳情見 官網

---

如果是要靜態頁面的話直接ctrl +s 完事了，或者ctrl +p 保存為pdf，

如果是要別人的特效或者別人的功能，那得f12 分析源代碼了，這個很費事

如果是爬蟲的話，chrome關了跨域，用jq發ajax請求就ok了

---

我一直在用這個在線版的 在線扒站工具

---

不知道你說的扒網站是啥。如果你是想看網站的html代碼的話，可以去瀏覽器設置裡面找查看源碼，有的瀏覽器按F12也能直接看。

---

Chrome打開開發者工具，選到Network標籤。

---

推薦閱讀：