express實現線上爬取網頁圖片

先奉上圖夫地址：

https：//tufu。xkboke。com

GIT開源地址：

https：//github。com/gengchen528/imgSpider

（歡迎star）

懶惰驅動Idea

有時候在站酷或者UI中國看到很好的圖片和作品都會想收藏下來學習一下，但是每次右擊另存為都很麻煩，而且有的還要放大後才有原圖可以下載；作為一個偽全棧怎麼能忍呢，然後就想著扒扒他們網站的原始碼看，這一看發現圖片原圖存放的位置都有著規律，這就很高興啦，哈哈！

雛形誕生

浪起來！！很快完成了第一個小指令碼，順利把需要的圖片下載了下來，但只是最簡單的爬取圖片，後來優化了一下，把每次下載的圖片都放到不同資料夾。但是轉頭一想，獨樂樂不如眾樂樂，就想著乾脆把這個指令碼工具化，做一個可以相容多個網站的爬蟲工具，並且可以批次下載原圖，想法很快被付諸實踐，經過不斷的改版後，終於我的圖夫出來了第一版。

迭代最佳化

一開始只支援站酷和UI中國，而且對其他的網站都相容的不是很好，沒關係，先做出第一版，接著慢慢迭代，後來根據反饋又添加了塗鴉王國，設計癖，視覺ME等網站，最近幾天在逛貼吧，發現貼吧的一些圖片也是很漂亮，有很多可以當桌布的圖片，但是要下到原圖需要三四次步驟，而且一次只能下載一個，所以呢，我又把它加入我的圖夫工具中了，哈哈！我的圖夫又慢慢壯大起來了！先放一張圖展示一下我的圖夫

技術棧

其實原理大家都知道的，就是爬蟲，只是我把爬蟲視覺化做成了一個工具，方便日常使用而已，這裡主要使用的是express，庫的話用的是request，compressing用來壓縮資料夾，node-uuid用來生成隨機hash；放一張目錄結構

部分程式碼

index。js 主要請求檔案，其他檔案就移步git檢視吧

const request = require（‘request’）；

const path = require（‘path’）；

const fs = require（‘fs’）；

const analyze = require（‘。/analyze’）；

const tarTool = require（‘。/tarTool’）

const uuid =require（‘node-uuid’）

/**

* 根據hash值建立資料夾

* @param path

function write（path） {

fs。exists（path， function （exists） { //path為資料夾路徑

if （！exists） {

fs。mkdir（path， function （err） {

if （err） {

console。log（‘建立失敗’）；

return false；

} else {

console。log（‘建立成功’）；

}

}）

}

}）

}

/**

* 請求圖片地址

* @param response

* @param req

* @param next

function start（req，response，next） {

const hash = uuid。v1（）。replace（/-/g， “”）

const imgDir = path。join（path。resolve（__dirname， ‘。。’）， ‘output/img/’+hash）；

write（imgDir）

// 發起請求獲取 DOM

console。log（‘請求地址’，req。url）；

request（req。url， function（err， res， body） {

if （！err && res） {

console。log（‘start’）；

// 將 downLoad 函式作為引數傳遞給 analyze 模組的 findImg 方法

analyze。findImg（body，req。type，imgDir，downLoad，req。url）；

response。json（{head： {code： 0， msg： ‘ok’}， data： hash}）

}else {

response。json（{head： {code： 1000， msg： err}， data： ‘’}）

}

}）；

}

/**

* 獲取到 findImg 函式返回的圖片地址後，利用 request 再次發起請求，將資料寫入本地。

* @param {*} imgUrl

* @param {*} i

* @param {*} imgDir

function downLoad（imgUrl， i，imgDir） {

console。log（‘圖片地址’，imgUrl）；

let ext = imgUrl。split（‘。’）。pop（）；

// 再次發起請求，寫檔案

request（imgUrl）。pipe（fs。createWriteStream（path。join（imgDir， i + ‘。’ + ext）， {

‘encoding’： ‘utf8’，

}））；

}

/**

* 下載圖片到本地後，利用tar壓縮成一個壓縮包，並返回路徑

* @param {*} req

* @param {*} response

* @param {*} next

function tarFile（req，response，next） {

console。log（‘接收’，req）；

tarTool。tarTool（req。path，response）

}

module。exports= {

getImg：start，

tarTool：tarFile

}

使用方法

當然既然是工具，就必須非常簡單啦，你只需複製你要下載頁面的URL連結，然後貼上到我的輸入框中就可以，然後選擇網站型別（當然悄悄告訴你，不選也沒關係，我做了一個校驗），然後就是點選搜尋了，接下來就是耐心的等待。。。loading。。。。（因為伺服器的頻寬只有1M，所以會下載有點慢，如果你願意打賞一下，我也是不介意的，哈哈），執行完畢後，會出現下載按鈕，你只需要點選下載即可下載打包完畢的檔案了。