強(qiáng)調(diào)：前端所有的內(nèi)容是作為了解，不需要自己能夠?qū)懗鰜恚?/p>

創(chuàng)新互聯(lián)專注于福貢企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站,成都做商城網(wǎng)站。福貢網(wǎng)站建設(shè)公司,為福貢等地區(qū)提供建站服務(wù)。全流程按需網(wǎng)站開發(fā)，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)

目的：大致看懂網(wǎng)頁的頁面源碼

Web的基本概念 軟件開發(fā)的架構(gòu)

• 目前我們了解常見應(yīng)用程序/軟件大致可以分為兩種：
  • 第一種是應(yīng)用類：qq、微信、網(wǎng)盤、優(yōu)酷這一類是屬于需要安裝的桌面應(yīng)用
  • 第二種是web類：比如百度、知乎、博客園等使用瀏覽器訪問就可以直接使用的應(yīng)用
• 這些應(yīng)用的本質(zhì)其實(shí)都是兩個(gè)程序之間的通訊。而這兩個(gè)分類又對(duì)應(yīng)了兩個(gè)軟件開發(fā)的架構(gòu)：
  • C/S架構(gòu)
  • B/S架構(gòu)

C/S架構(gòu)

• C/S即：Client與Server ，中文意思：客戶端與服務(wù)器端架構(gòu)。
  • 我們把提供數(shù)據(jù)的一方稱之為服務(wù)器(Server),把訪問數(shù)據(jù)的一方稱為客戶端(Client)
  • 比如：電腦上要看視頻就需要裝看視頻的程序.例如騰訊視頻,它就是客戶端程序,騰訊公司的機(jī)房里運(yùn)行著騰訊視頻的服務(wù)器程序,所以它也是C/S構(gòu)架的程序

B/S架構(gòu)

• B/S即：Browser與Server,中文意思：瀏覽器端與服務(wù)器端架構(gòu)。

• Browser瀏覽器，其實(shí)也是一種Client客戶端，只是這個(gè)客戶端不需要大家去安裝什么應(yīng)用程序，只需在瀏覽器上通過HTTP請(qǐng)求服務(wù)器端相關(guān)的資源（網(wǎng)頁資源）即可。

HTTP協(xié)議(大致了解) http協(xié)議簡介

HTTP協(xié)議是Hyper Text Transfer Protocol（超文本傳輸協(xié)議）的縮寫,是用于萬維網(wǎng)（WWW:World Wide Web ）服務(wù)器與本地瀏覽器之間傳輸超文本的傳送協(xié)議。

超文本：超文本就是指“含有指向其他資源鏈接”內(nèi)容的文本。大概就是，不僅僅是文字，還有多媒體：視頻、圖片、動(dòng)畫等。

協(xié)議：HTTP協(xié)議就是服務(wù)器（Server）和客戶端（Client）之間進(jìn)行數(shù)據(jù)交互（相互傳輸數(shù)據(jù)）的一種協(xié)議。我們可以將Server和Client進(jìn)行擬人化，那么該協(xié)議就是Server和Client這兩兄弟間指定的一種交互溝通方式。大家都看過智取威虎山中楊子榮和土匪們之間說的黑話吧：

- 土匪：蘑菇，你哪路？什么價(jià)？（什么人？到哪里去？）

- 楊子榮：哈！想啥來啥，想吃奶來了媽媽，想娘家的人，孩子他舅舅來了。（找同行）

- 楊子榮：拜見三爺！

- 土匪：天王蓋地虎?。愫么蟮哪懀「襾須饽愕淖孀?？）

- 楊子榮：寶塔鎮(zhèn)河妖?。ㄒ悄菢樱形覐纳缴纤に?，掉河里淹死。）

- 土匪：野雞悶頭鉆，哪能上天王山?。悴皇钦频?。）
- 楊子榮：地上有的是米，喂呀，有根底?。ɡ献邮钦频模吓频?。）
- 土匪：拜見過阿媽啦？（你從小拜誰為師？）
- 楊子榮：他房上沒瓦，非否非，否非否?。ú坏秸貌荒苷f。）
- 土匪：嘛哈嘛哈？（以前獨(dú)干嗎？）
- 楊子榮：正晌午說話，誰還沒有家？（許大馬棒山上。）
- 土匪：好叭噠?。▋?nèi)行，是把老手）
- 楊子榮：天下大耷拉！（不吹牛，闖過大隊(duì)頭。）
- 座山雕：臉紅什么？
- 楊子榮：精神煥發(fā)！
- 座山雕：怎么又黃了？
- 楊子榮：防冷，涂的蠟！
- 座山雕：曬噠曬噠。（誰指點(diǎn)你來的？）
- 楊子榮：一座玲瓏塔，面向青寨背靠沙！（是個(gè)道人。）

是不是看到這里，有得童鞋終于知道了傳說中的‘天王蓋地虎’是真正含義了吧。此黑話其實(shí)就是楊子榮和土匪之間進(jìn)行交互溝通的方式（協(xié)議）。

HTTP于1990年提出，經(jīng)過幾年的使用與發(fā)展，得到不斷地完善和擴(kuò)展。HTTP協(xié)議工作于客戶端-服務(wù)端（B/S）架構(gòu)為上。瀏覽器作為HTTP客戶端通過URL向HTTP服務(wù)端即WEB服務(wù)器發(fā)送所有請(qǐng)求。Web服務(wù)器根據(jù)接收到的請(qǐng)求后，向客戶端發(fā)送響應(yīng)信息。

http協(xié)議特性 基于請(qǐng)求－響應(yīng)模式

HTTP協(xié)議規(guī)定,請(qǐng)求從客戶端發(fā)出,最后服務(wù)器端響應(yīng)該請(qǐng)求并返回。換句話說,肯定是先從客戶端開始建立通信的,服務(wù)器端在沒有接收到請(qǐng)求之前不會(huì)發(fā)送響應(yīng)

無連接

無連接的含義是限制每次連接只處理一個(gè)請(qǐng)求。服務(wù)器處理完客戶的請(qǐng)求，并收到客戶的應(yīng)答后，即斷開連接。采用這種方式可以節(jié)省傳輸時(shí)間。請(qǐng)思考：雙11淘寶平臺(tái)，一個(gè)小時(shí)的網(wǎng)站訪問量就達(dá)到了2億次，如果一個(gè)客戶的請(qǐng)求連接耗時(shí)1s，那么淘寶是如何實(shí)現(xiàn)在一個(gè)小時(shí)內(nèi)可以有2億次的連接訪問呢？

無狀態(tài)

HTTP協(xié)議 自身不對(duì)請(qǐng)求和響應(yīng)之間的通信狀態(tài)進(jìn)行保存。也就是說在HTTP這個(gè)級(jí)別,協(xié)議對(duì)于發(fā)送過的請(qǐng)求或響應(yīng)都不做持久化處理。每當(dāng)有新的請(qǐng)求發(fā)送時(shí),就會(huì)有對(duì)應(yīng)的新響應(yīng)產(chǎn)生。協(xié)議本身并不保留之前一切的請(qǐng)求或響應(yīng)的相關(guān)信息。這是為了更快地處理大量事務(wù),確保協(xié)議的可伸縮性,而特意把HTTP協(xié)議設(shè)計(jì)成如此簡單的。

狀態(tài)可以理解為客戶端和服務(wù)器在某次會(huì)話中產(chǎn)生的數(shù)據(jù)，那無狀態(tài)的就以為這些數(shù)據(jù)不會(huì)被保留。如果會(huì)話中產(chǎn)生的數(shù)據(jù)是我們需要保存的，也就是說要“保持狀態(tài)”。

可是,隨著Web的不斷發(fā)展,因無狀態(tài)而導(dǎo)致業(yè)務(wù)處理變得棘手的情況增多了。比如,用戶登錄到一家購物網(wǎng)站,即使他跳轉(zhuǎn)到該站的其他頁面后,也需要能繼續(xù)保持登錄狀態(tài)。網(wǎng)站為了能夠掌握是誰送出的請(qǐng)求,需要保存用戶的狀態(tài)。

HTTP/1.1雖然是無狀態(tài)協(xié)議,但為了實(shí)現(xiàn)期望的保持狀態(tài)功能, 于是引入了Cookie技術(shù)。有了Cookie再用HTTP協(xié)議通信,就可以管理狀態(tài)了。有關(guān)Cookie的詳細(xì)內(nèi)容稍后講解。

http請(qǐng)求協(xié)議與響應(yīng)協(xié)議

http協(xié)議包含由瀏覽器發(fā)送數(shù)據(jù)到服務(wù)器需要遵循的請(qǐng)求協(xié)議與服務(wù)器發(fā)送數(shù)據(jù)到瀏覽器需要遵循的響應(yīng)協(xié)議。

用于HTTP協(xié)議交互的信息被稱為HTTP報(bào)文。請(qǐng)求端(客戶端)的HTTP報(bào)文叫做請(qǐng)求報(bào)文,響應(yīng)端(服務(wù)器端)的叫做響應(yīng)報(bào)文。HTTP報(bào)文本身是由多行數(shù)據(jù)構(gòu)成的字文本。

(1) 請(qǐng)求協(xié)議

• 請(qǐng)求頭：

  • 請(qǐng)求頭中存儲(chǔ)的是該請(qǐng)求的一些主要說明（自我介紹）。服務(wù)器據(jù)此獲取客戶端的信息。

  • accept:瀏覽器通過這個(gè)頭告訴服務(wù)器，它所支持的數(shù)據(jù)類型
    Accept-Charset: 瀏覽器通過這個(gè)頭告訴服務(wù)器，它支持哪種字符集
    Accept-Encoding：瀏覽器通過這個(gè)頭告訴服務(wù)器，支持的壓縮格式
    Accept-Language：瀏覽器通過這個(gè)頭告訴服務(wù)器，它的語言環(huán)境
    Host：瀏覽器通過這個(gè)頭告訴服務(wù)器，想訪問哪臺(tái)主機(jī)
    If-Modified-Since: 瀏覽器通過這個(gè)頭告訴服務(wù)器，緩存數(shù)據(jù)的時(shí)間
    Referer：瀏覽器通過這個(gè)頭告訴服務(wù)器，客戶機(jī)是哪個(gè)頁面來的 防盜鏈
    X-Requested-With: XMLHttpRequest 代表通過ajax方式進(jìn)行訪問
    User-Agent：請(qǐng)求載體的身份標(biāo)識(shí)

• 報(bào)文體：

  • 常被叫做請(qǐng)求體，請(qǐng)求體中存儲(chǔ)的是將要傳輸/發(fā)送給服務(wù)器的數(shù)據(jù)信息。

請(qǐng)求方式: get與post請(qǐng)求

• GET提交的數(shù)據(jù)會(huì)放在URL之后，以?分割URL和傳輸數(shù)據(jù)，參數(shù)之間以&相連，如EditBook?name=test1&id=123456.
• POST方法是把提交的數(shù)據(jù)放在HTTP包的請(qǐng)求體中.
• GET提交的數(shù)據(jù)大小有限制（因?yàn)闉g覽器對(duì)URL的長度有限制），而POST方法提交的數(shù)據(jù)沒有大小限制，且攜帶的請(qǐng)求數(shù)據(jù)不可以明文方式連接在url中。

(2) 響應(yīng)協(xié)議

• 響應(yīng)頭：

  • 響應(yīng)頭中存儲(chǔ)的是該響應(yīng)的一些主要說明（自我介紹）。客戶端據(jù)此獲取服務(wù)器的相關(guān)信息。

• Location: 服務(wù)器通過這個(gè)頭，來告訴瀏覽器跳到哪里
  Server：服務(wù)器通過這個(gè)頭，告訴瀏覽器服務(wù)器的型號(hào)
  Content-Encoding：服務(wù)器通過這個(gè)頭，告訴瀏覽器，數(shù)據(jù)的壓縮格式
  Content-Length: 服務(wù)器通過這個(gè)頭，告訴瀏覽器回送數(shù)據(jù)的長度
  Content-Language: 服務(wù)器通過這個(gè)頭，告訴瀏覽器語言環(huán)境
  Content-Type：服務(wù)器通過這個(gè)頭，告訴瀏覽器回送數(shù)據(jù)的類型
  Refresh：服務(wù)器通過這個(gè)頭，告訴瀏覽器定時(shí)刷新
  Content-Disposition: 服務(wù)器通過這個(gè)頭，告訴瀏覽器以下載方式打數(shù)據(jù)
  Transfer-Encoding：服務(wù)器通過這個(gè)頭，告訴瀏覽器數(shù)據(jù)是以分塊方式回送的
  Expires: -1 控制瀏覽器不要緩存
  Cache-Control: no-cache
  Pragma: no-cache

• 響應(yīng)體：

  • 根據(jù)客戶端指定的請(qǐng)求信息，發(fā)送給客戶端的指定數(shù)據(jù)

• 響應(yīng)狀態(tài)碼：

  • 狀態(tài)碼指的是是當(dāng)客戶端向服務(wù)器端發(fā)送請(qǐng)求時(shí), 返回的請(qǐng)求結(jié)果。借助狀態(tài)碼,用戶可以知道服務(wù)器端是正常受理了請(qǐng)求,還是出現(xiàn)了什么問題錯(cuò)誤 。
    

Cookie概述（基本了解） COOKIE的由來

• 大家都知道HTTP協(xié)議是無狀態(tài)的。
  • 狀態(tài)可以理解為客戶端和服務(wù)器在某次會(huì)話中產(chǎn)生的數(shù)據(jù)，那無狀態(tài)的就以為這些數(shù)據(jù)不會(huì)被保留。每當(dāng)有新的請(qǐng)求發(fā)送時(shí),就會(huì)有對(duì)應(yīng)的新響應(yīng)產(chǎn)生。協(xié)議本身并不保留之前一切的請(qǐng)求或響應(yīng)的相關(guān)信息。
  • 一句有意思的話來描述就是人生只如初見，對(duì)服務(wù)器來說，每次的請(qǐng)求都是全新的，及時(shí)同一個(gè)客戶端發(fā)起的多個(gè)請(qǐng)求間。隨著Web的不斷發(fā)展,因無狀態(tài)而導(dǎo)致業(yè)務(wù)處理變得棘手的情況增多，因此我們需要解決這個(gè)問題，也就是說要讓http可以“保持狀態(tài)”，那么Cookie就是在這樣一個(gè)場景下誕生。

什么是cookie

• 首先來講，cookie是瀏覽器的技術(shù)，Cookie具體指的是一段小信息，它是服務(wù)器發(fā)送出來存儲(chǔ)在瀏覽器上的一組組鍵值對(duì)，可以理解為服務(wù)端給客戶端的一個(gè)小甜點(diǎn)，下次訪問服務(wù)器時(shí)瀏覽器會(huì)自動(dòng)攜帶這些鍵值對(duì)，以便服務(wù)器提取有用信息。

記?。篶ookie表示的鍵值對(duì)數(shù)據(jù)是由服務(wù)器創(chuàng)建，且存儲(chǔ)在客戶端瀏覽器中。

cookie的原理

• cookie的工作原理是：
  • 瀏覽器訪問服務(wù)端，帶著一個(gè)空的cookie，然后由服務(wù)器產(chǎn)生內(nèi)容，瀏覽器收到相應(yīng)后保存在本地；
  • 當(dāng)瀏覽器再次訪問時(shí)，瀏覽器會(huì)自動(dòng)帶上Cookie，這樣服務(wù)器就能通過Cookie的內(nèi)容來判斷這個(gè)是“誰”了。
  • cookie的內(nèi)容是有服務(wù)器自主設(shè)計(jì)的，客戶端無法干涉！
    

cookie的規(guī)范

• Cookie大小上限為4KB；

• 一個(gè)服務(wù)器最多在客戶端瀏覽器上保存20個(gè)Cookie；

• 一個(gè)瀏覽器最多保存300個(gè)Cookie，因?yàn)橐粋€(gè)瀏覽器可以訪問多個(gè)服務(wù)器。

• 上面的數(shù)據(jù)只是HTTP的Cookie規(guī)范，但在瀏覽器大戰(zhàn)的今天，一些瀏覽器為了打敗對(duì)手，為了展現(xiàn)自己的能力起見，可能對(duì)Cookie規(guī)范“擴(kuò)展”了一些，例如每個(gè)Cookie的大小為8KB，最多可保存500個(gè)Cookie等！但也不會(huì)出現(xiàn)把你硬盤占滿的可能！

• 注意，不同瀏覽器之間是不共享Cookie的。也就是說在你使用IE訪問服務(wù)器時(shí)，服務(wù)器會(huì)把Cookie發(fā)給IE，然后由IE保存起來，當(dāng)你在使用FireFox訪問服務(wù)器時(shí)，不可能把IE保存的Cookie發(fā)送給服務(wù)器。

你是否還在尋找穩(wěn)定的海外服務(wù)器提供商？創(chuàng)新互聯(lián)www.cdcxhl.cn海外機(jī)房具備T級(jí)流量清洗系統(tǒng)配攻擊溯源，準(zhǔn)確流量調(diào)度確保服務(wù)器高可用性，企業(yè)級(jí)服務(wù)器適合批量采購，新人活動(dòng)首月15元起，快前往官網(wǎng)查看詳情吧

當(dāng)前文章：python爬蟲學(xué)習(xí)筆記-Web的基本概念-創(chuàng)新互聯(lián)
路徑分享：http://weahome.cn/article/jseie.html