整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
過往期的文章，我們可以爬取網(wǎng)頁(yè)上面的文字信息，本期介紹一下如何爬取圖片信息，以及保存圖片到本地。
我們以校花網(wǎng)為爬取對(duì)象，爬取圖片信息:http://www.xiaohuar.com
class PowersSpider(scrapy.Spider): name = "xiaohua" # 爬蟲的名字 allowed_domains = ["xiaohuar.com"] # 定義第一個(gè)URL first_url = 'http://www.xiaohuar.com/list-1-1.html' def start_requests(self): # 返回調(diào)度器處理好的request yield Request(self.first_url, self.parse)
定義好爬蟲的基本信息后，定義prase函數(shù)來處理爬蟲信息
def parse(self, response):
tds = BeautifulSoup(response.text, 'lxml').find_all(class_='img')
item = PowersItem_xiaohua() # item初始化
# print(tds)
for td in tds:
name = td.find_all('a')[0].find('img')['alt']
address = td.find_all('a')[0].find('img')['src']
address = 'http://www.xiaohuar.com' + address
item['name'] = name
item['address'] = address
yield item
通過查看網(wǎng)頁(yè)信息，可以很清楚的知道我們爬取照片的信息，在照片信息里面有一個(gè)圖片地址，但是這并不是圖片的真正地址，圖片的真正地址需要加上校花網(wǎng)的主頁(yè)地址，當(dāng)你把這個(gè)真正的圖片地址輸入瀏覽器時(shí)，就可以很清楚的看到圖片的原圖了，右擊可以另存為，但是我們不會(huì)一個(gè)一個(gè)照片的保存
scrapy自帶圖片保存的中間組件，但是使用起來，比較麻煩，我們自己寫pipeline來保存照片
class Powerspipeline_xiaohua(object):
def process_item(self, item, spider):
headers = {
'User-Agent': 'Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.101 Safari/537.36'}
if isinstance(item, PowersItem_xiaohua):
#請(qǐng)求網(wǎng)頁(yè)
req = urllib.request.Request(url=item['address'], headers=headers)
#打開網(wǎng)頁(yè)
res = urllib.request.urlopen(req)
#保存圖片，并修改圖片的名字
file_name = os.path.join(r'D:\foxtable\picture', item['name'] + '.jpg')
with open(file_name, 'wb') as fp:
fp.write(res.read())#保存圖片
else:
print('no find items')
return item
python自帶urllib，也可以使用urllib來做爬蟲，在此我們定義 了一個(gè)headers
headers：
在使用python爬蟲爬取數(shù)據(jù)的時(shí)候，經(jīng)常會(huì)遇到一些網(wǎng)站的反爬蟲措施，一般就是針對(duì)于headers中的User-Agent，如果沒有對(duì)headers進(jìn)行設(shè)置，User-Agent會(huì)聲明自己是python腳本,而如果網(wǎng)站有反爬蟲的想法的話，必然會(huì)拒絕這樣的連接。而修改headers可以將自己的爬蟲腳本偽裝成瀏覽器的正常訪問，來避免這一問題。
美女照片
運(yùn)行以上代碼，就可以把美女照片全部保存到本地了
本期只是爬取了一個(gè)界面，網(wǎng)友們可以參考往期的文章，爬取更多的界面，以便保存更多的美女照片。
下期我們分享一下如何爬取音樂文件
謝謝大家的點(diǎn)贊與轉(zhuǎn)發(fā)，關(guān)于分享的文章，大家有任何問題，可以在評(píng)論區(qū)一起探討學(xué)習(xí)！！！
什么學(xué)習(xí)HTML？
理解HTML代碼是制作網(wǎng)頁(yè)的基本技能。在互聯(lián)網(wǎng)高度發(fā)達(dá)的今天，網(wǎng)頁(yè)制作技術(shù)開始變的和修圖、處理視頻一樣重要。
第一，學(xué)會(huì)制作網(wǎng)頁(yè)就可以把自己想要展示的信息讓其他人使用瀏覽器觀看，無(wú)論是文字、照片還是視頻都可以通過瀏覽器觀看，甚至是分享自己制作的小游戲。
第二，理解網(wǎng)頁(yè)運(yùn)行的基本原理后可以更好的瀏覽他人的網(wǎng)頁(yè)，尋找有用信息，更合理的使用第三方工具，簡(jiǎn)單高效的制作自己的網(wǎng)頁(yè)。
HTML學(xué)習(xí)難度與重要性
HTML代碼本身非常容易理解，使用也非常簡(jiǎn)單，但是單純使用HTML代碼寫出的網(wǎng)頁(yè)效果和我們平時(shí)看到的網(wǎng)頁(yè)相差甚遠(yuǎn)。要想做出一個(gè)漂亮的頁(yè)面，我們還需要CSS和JavaScript的幫助。
HTML、CSS、JavaScript這些不同的代碼都有什么作用呢？簡(jiǎn)單來說，HTML代碼可以為網(wǎng)頁(yè)提供基本內(nèi)容，比如文字、圖片、音樂、視頻等。CSS代碼可以為頁(yè)面安排布局，比如標(biāo)題的位置、字體、顏色、大小等，籠統(tǒng)的說就是為HTML代碼添加的內(nèi)容增加樣式信息，例如修改位置、尺寸、顏色等屬性。JavaScript代碼可以為頁(yè)面提供交互（互動(dòng)）功能，例如通過按鈕控制頁(yè)面內(nèi)容的隱藏、出現(xiàn)，或者為多張圖片添加輪播功能等。
對(duì)比起來，HTML的學(xué)習(xí)難度最低，但作用是最重要的，因?yàn)橐磺许?yè)面的基礎(chǔ)是內(nèi)容，沒有內(nèi)容，樣式與交互都不存在。
認(rèn)識(shí)HTML基本結(jié)構(gòu)
第一行 <!DOCTYPE HTML>
第二行 <html>
第三行 <head>
第四行 </head>
第五行 <body>
第六行 </body>
第七行 </html>
以上七行代碼是一個(gè)網(wǎng)頁(yè)文件的HTML代碼的基本結(jié)構(gòu)。
大家觀察一下可以發(fā)現(xiàn)一個(gè)規(guī)律，每一行的內(nèi)容都是寫在“<>”里面的。原因說來話長(zhǎng)，先記住就行。每個(gè)寫在“<>”里面的內(nèi)容叫做“標(biāo)簽”。以后“標(biāo)簽”這個(gè)詞會(huì)經(jīng)常出現(xiàn)。
第一行<!DOCTYPE HTML>標(biāo)簽指示 web 瀏覽器關(guān)于頁(yè)面使用哪個(gè) HTML 版本進(jìn)行編寫的指令（這句話可以暫時(shí)不必理解）。重要的是這句傲嬌的代碼只能存在在HTML代碼的第一行！
第二行<html>標(biāo)簽與第七行的</html>標(biāo)簽是一對(duì)，“<html>”叫做開始標(biāo)簽，“</html>”叫做結(jié)束標(biāo)簽。他們之間的區(qū)別在于結(jié)束標(biāo)簽比開始標(biāo)簽多一個(gè)“/”。這是HTML代碼的一個(gè)重要規(guī)律，以后我將要學(xué)到的大部分標(biāo)簽都是這樣的，可能瀏覽器有些強(qiáng)迫癥吧，如果沒有結(jié)束標(biāo)簽它會(huì)很不舒服，有可能會(huì)消極怠工而產(chǎn)生麻煩（不能正常顯示）。不過遺憾的是<!DOCTYPE HTML>太傲嬌，至今沒有另一半。<html> 與 </html> 標(biāo)簽限定了文檔的開始點(diǎn)和結(jié)束點(diǎn)。
第三行與第四行組成一對(duì)，叫做“head”標(biāo)簽。顧名思義，這個(gè)“頭”標(biāo)簽里的內(nèi)容統(tǒng)領(lǐng)全局，比如控制布局與樣式的CSS代碼文件和添加互動(dòng)功能的JavaScript代碼文件在這里添加或?qū)耄凰阉黜?yè)面用的關(guān)鍵詞信息在這里添加；頁(yè)面信息的編碼方式也是由此指定；瀏覽器窗口的標(biāo)題也在這里顯示。
第五行與第六行組成一對(duì)，叫做“body”標(biāo)簽。用來顯示所有的頁(yè)面內(nèi)容信息。
畫個(gè)圖來表示一下這四個(gè)標(biāo)簽的層級(jí)關(guān)系（就是誰(shuí)包含誰(shuí)的意思，或者誰(shuí)在誰(shuí)的勢(shì)力范圍內(nèi)出現(xiàn)）：
邊學(xué)邊練------寫一個(gè)最簡(jiǎn)單的頁(yè)面
正所謂萬(wàn)丈高樓平地起，下面我們就動(dòng)手做我們的第一個(gè)網(wǎng)頁(yè)文件。
工具：電腦，安裝一個(gè)瀏覽器（IE 火狐 谷歌瀏覽器都可以），確定“記事本”工具可用。
有了以上工具我們就可以寫了。
Step1 新建一個(gè).txt文件。
操作如下：
（1）選擇合適的磁盤，比如D盤或F盤新建一個(gè)文件夾，命名為“網(wǎng)頁(yè)”。點(diǎn)擊進(jìn)入。
（2）在空白處點(diǎn)擊鼠標(biāo)右鍵新建一個(gè)文本文件，命名為“第一個(gè)頁(yè)面”。這時(shí)我們就有了一個(gè)“第一個(gè)頁(yè)面.txt”文件了。
如果你的電腦不顯示“.txt”這樣的文件后綴，可以在屏幕左上方尋找“查看”菜單，如圖2
圖 2
點(diǎn)擊后，出現(xiàn)如下菜單如圖3，點(diǎn)擊“選項(xiàng)”。
圖 3
點(diǎn)擊“查看”，去掉“隱藏已知文件類型的擴(kuò)展名”選項(xiàng)前的“對(duì)號(hào)”，如圖4所示。這時(shí)就能顯示或修改文件后綴了。
圖 4
Step2 添加內(nèi)容
（1）雙擊打開“第一個(gè)頁(yè)面.txt”文件，把HTML基本結(jié)構(gòu)共七行代碼輸入進(jìn)去。
（2）保存，關(guān)閉文件，在“第一個(gè)頁(yè)面.txt”文件上點(diǎn)擊鼠標(biāo)右鍵，選擇“重命名”，將“.txt”修改為“.html”。這時(shí)，系統(tǒng)會(huì)提示，如圖1，大膽點(diǎn)“是”。
圖 1
這時(shí)我們的文件就變成了html網(wǎng)頁(yè)文件了。
我們雙擊這個(gè)文件發(fā)現(xiàn)瀏覽器內(nèi)一片空白，這就好比我們?cè)谧雷由蠑[了個(gè)碟子，里面并沒有放美食。瀏覽器中的一片白就是空碟子的顏色，而HTML基本結(jié)構(gòu)就是這個(gè)碟子。
下面我們往碟子里加點(diǎn)東西。
Step3 添加內(nèi)容
（1）在“第一個(gè)頁(yè)面.html”文件上點(diǎn)擊鼠標(biāo)右鍵，選擇“打開方式”，選擇“記事本”，如果沒有“記事本”選項(xiàng)，請(qǐng)點(diǎn)擊“選擇其他應(yīng)用”，點(diǎn)擊選擇最下面的“更多應(yīng)用”，選擇“記事本”。下一次選擇“打開方式”時(shí)，“記事本”就會(huì)出現(xiàn)了。
（2）在<head></head>標(biāo)簽之間添加“<title>學(xué)習(xí)寫第一個(gè)網(wǎng)頁(yè)</title>”。在<body></body>之間添加“<h1>第一個(gè)網(wǎng)頁(yè)</h1>”；“<p>隨著學(xué)的內(nèi)容越來越多，網(wǎng)頁(yè)就會(huì)越來越漂亮了！</p>”完成如圖5
圖 5
（3）保存，關(guān)閉，雙擊打開！效果如圖6
圖6
今天的邊學(xué)邊做就到這里，下一次會(huì)詳細(xì)解釋<head>標(biāo)簽、<body>標(biāo)簽中常出現(xiàn)的子標(biāo)簽以及它們各自的作用。
第二篇《邊學(xué)邊做網(wǎng)頁(yè)篇——<head>標(biāo)簽里裝點(diǎn)啥？》http://mp.toutiao.com/preview_article/?pgc_id=6738988870622249479
網(wǎng)頁(yè)下載下來使用，在日常工作中使用頻率還是很高的，有時(shí)候確實(shí)能解一時(shí)之急，我自己就有很窘迫的經(jīng)歷。
我開會(huì)的時(shí)候，都會(huì)把準(zhǔn)備好的文檔存在局域網(wǎng)，到會(huì)議室直接打開就能直接用了。有一次到分公司，由于分公司剛剛成立，內(nèi)網(wǎng)還沒有和母公司連通。結(jié)果這下子懵逼了，上不去內(nèi)網(wǎng)，看不到文檔。又是叫同事發(fā)過來，又是提發(fā)送文件的安全申請(qǐng)，讓人著急。
如果把網(wǎng)站保存下來，放在自己的電腦中，既不用擔(dān)心信息泄露問題，又不用為了看不了文檔而著急。
遇到問題，記錄下來，然后解決問題，程序員的解決思路永遠(yuǎn)是自己創(chuàng)造輪子的，接下來就是不斷的探索解決方案。
其實(shí)下載網(wǎng)頁(yè)的方式有很多種，其中有幾種辦法使用的比較多，例如：如果你用Chrome，直接按 Ctrl+s 就可實(shí)現(xiàn)。使用這種方法，Chrome會(huì)把整個(gè)網(wǎng)站，按照編譯完成的源碼目錄結(jié)構(gòu)保存下來。像下面這樣：
下載完成的文件直接點(diǎn)擊 xxx.html 可以直接離線訪問，但是這種方式對(duì)目錄的依賴結(jié)構(gòu)比較高，怎么理解呢？就是 html 文件和對(duì)應(yīng)文件名的文件夾必須在同一個(gè)目錄中，才能正常使用。拷貝到其他機(jī)器的時(shí)候必須要兩個(gè)同時(shí)拷貝才可以，否則就會(huì)排版錯(cuò)亂。
如果有十個(gè)或者更多的網(wǎng)頁(yè)需要拷貝或者刪除，就會(huì)很麻煩，例如我想在其中找到其中幾個(gè)，復(fù)制到其他地方，很容易弄錯(cuò)順序。
HTML 是一種純文本格式，它用于排版文字。純文本文檔的意思就是，文檔中只包含文字內(nèi)容，不包含二進(jìn)制內(nèi)容，舉個(gè)例子：打印出的A4紙，只有文字沒有圖片。而 HTML 想要顯示照片等二進(jìn)制信息，通常都會(huì)鏈接到其他文件，也就是上面文件夾里面的內(nèi)容。
不過 Chrome 下載文件這種方式也有優(yōu)點(diǎn)，下載下來的文件可以保持獨(dú)立性，比如說，我需要這個(gè)網(wǎng)頁(yè)中的一張圖片，那么就可以直接到文件夾里面尋找了。
另外還有一種辦法，也有很多人再使用。Chrome 在打印網(wǎng)頁(yè)的時(shí)候，會(huì)把網(wǎng)頁(yè)轉(zhuǎn)成 PDF ，然后在進(jìn)行打印。那么就給我們提供了很明確的思路，把網(wǎng)頁(yè)直接保存為 PDF ，這樣保存下來的網(wǎng)頁(yè)就只有一個(gè)文件。
使用Chrome，直接按下Ctrl+p就可以。然后目標(biāo)打印機(jī)選擇 另存為 PDF 。
這個(gè)功能很多瀏覽器都支持
但是這種辦法也有很明顯的缺點(diǎn)，由于 PDF 是靜態(tài)文檔，網(wǎng)頁(yè)上的一些動(dòng)畫可能不會(huì)正常顯示，而且排版也有可能會(huì)錯(cuò)亂，這完全靠運(yùn)氣。個(gè)人覺得這不是一種很靠譜的方法。
這時(shí)候主角來了！有一個(gè)工具既可以把網(wǎng)頁(yè)保存為 html 又可以保持是單文件。他就是 monolith ，你可以在 github 上面找到它，但是源碼并沒有編譯為可執(zhí)行文件，我把它編譯了一下，下面會(huì)放上來鏈接，https://github.com/leconio/Repos/raw/master/monolith.7z。
那么下面就簡(jiǎn)單說說使用方法：如果你下載我的鏈接，那么里面有三個(gè)文件：
第一個(gè)是Mac平臺(tái)編譯出來的，使用方式為：
./monolith 網(wǎng)站地址 > xxx.html
默認(rèn)情況下 monolith 會(huì)把生成的 html 輸出到標(biāo)準(zhǔn)輸出流，也就是當(dāng)前終端。使用 > 我們把輸出的內(nèi)容重定向并覆蓋到文件。
執(zhí)行完成之后，在這個(gè)目錄下面就會(huì)有一個(gè)對(duì)應(yīng)的文件：xxx.html 。
另外兩個(gè)是 Windows 平臺(tái)使用的。為了簡(jiǎn)化使用，我寫了一個(gè) CMD 腳本。直接點(diǎn)擊 monolith.cmd ，然后粘貼地址就可以完成下載。
下載完成之后，在本地你會(huì)發(fā)現(xiàn)只有一個(gè) html 文件。我們打開之后，發(fā)現(xiàn)圖片和JS等信息都在，而且排版正常。那么就要思考了，我們之前說過，HTML 是放置純文本信息的，那么圖片在哪里呢？
答案顯而易見，就在 HTML 文件里面。為了方便小圖片傳輸，有一種叫 Base64 的東西，它可以把二進(jìn)制信息變成成純文本。這在使用 Json 傳遞數(shù)據(jù)的今天十分常見，它可以減少一次請(qǐng)求（題外話），這里就是用的這個(gè)原理。monolith 把圖片等二進(jìn)制內(nèi)容轉(zhuǎn)為了純文本，保存在 HTML 文件中。我們?cè)谙螺d的文件源碼可以看到：
對(duì)比源代碼，src 信息已經(jīng)變成了 base64 格式的圖片，就是那串亂碼。復(fù)制那串亂碼，從網(wǎng)上搜一個(gè) base64 轉(zhuǎn)圖片工具，粘貼進(jìn)去，這時(shí)會(huì)發(fā)現(xiàn)就是我們看到的那張圖片。這樣一來，無(wú)論這個(gè)網(wǎng)站上有多少個(gè)文件，都會(huì)保存到一個(gè) HTML 文件里面，而且還能離線使用。
當(dāng)然，base64 編碼的圖片比原生圖片略大，這可能也是你現(xiàn)在在擔(dān)心的問題。不過 monolith 會(huì)特殊處理文件體積。我們可以看看 Chrome 直接下載和使用 monolith 下載體積相差多少。我們把兩種方式下載的網(wǎng)頁(yè)都進(jìn)行了 7-Zip 壓縮。
我們可以看到，使用 monolith 下載會(huì)比 Chrome 直接下載小一倍還多！
最后要說的是局限性，無(wú)論那種方法，都幾乎不能把視頻網(wǎng)站中的視頻下載下來。因?yàn)楝F(xiàn)在的視頻地址都是 Token 加密的，同理，使用 Token 加密的其他請(qǐng)求信息也無(wú)法下載。
比如你可以試試下載其他網(wǎng)站的首頁(yè)，Logo 和視頻都是下載不了的。但是也有解決辦法，那就是另外一個(gè)領(lǐng)域的事情了，以后有機(jī)會(huì)說給大家聽。
如果這篇文章對(duì)您或者您的朋友有幫助，感謝您關(guān)注，轉(zhuǎn)發(fā)。
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
