頁面請求的順序
- 首先是客戶端發(fā)送請求,然后DNS進行解析,給瀏覽器返回一個IP地址。瀏覽器根據(jù)這個IP地址再進行請求,請求內(nèi)容是一個HTML或PHP等。
- 服務(wù)器(如APACHE服務(wù)員找到請求的HTML或PHP(php還會在服務(wù)器進行渲染后生成html),將這個HTML或PHP返回給瀏覽器)
- 客戶端根據(jù)得到的php或html頁面再次請求js,css,img等內(nèi)容。(根據(jù)代碼執(zhí)行的順序,從上到下進行請求)
- 服務(wù)器再次返回請求的內(nèi)容
-
瀏覽器在請求到j(luò)s或css或圖片后會對js或css或圖片文件進行解析,最終渲染一個完整的頁面
Snipaste_2018-01-30_10-59-01.png
所以我們之所以能在瀏覽器中看到一個完整的頁面,是由一次次請求與一次次響應(yīng)組成的
http協(xié)議就相當(dāng)高于我們找到工作后所簽訂的勞動合同,既約束勞動者,也約束用人單位。而http協(xié)議即約束Request也約束Response,在這樣的規(guī)范下兩者才能進行正常的交流(如果沒有http協(xié)議就相當(dāng)于一個用中文一個用英語很難溝通,所以當(dāng)然是大家都是用中文才能溝通的好啊,哈哈)
在谷歌的network中,view source就是查看源碼的意思,source就是源碼的意思
請求行-請求頭-請求主
請求頭中裝的是與瀏覽器相關(guān)的信息,比如上圖中的
Accept-Encoding:gizp,deflate,sdch。這個就表示瀏覽器能識別的編碼,因為服務(wù)器具有壓縮代碼的功能(為的是讓頁面更快的響應(yīng)),只有瀏覽器告訴服務(wù)器我能識別哪種壓縮過的代碼,服務(wù)器才會進行壓縮,否則服務(wù)器壓縮的代碼,瀏覽器無法解析,那就不能生成頁面了。上例中如果沒有請求頭中沒有g(shù)zip,那服務(wù)器就不會進行響應(yīng)的壓縮。(再比如host就指的是域名)請求中還有請求主體,但是get請求時看不到請求主體的。
post請求中form data就是請求主體(get方式就沒有)
正常情況下是不該有Query String Parameters,這部分是Chrome為了我們開發(fā)方便給我們添加的東西,所以Chrome的network里面展現(xiàn)的東西是給我們做了一層包裝,與真實的http請求是由一些差別的,差別就在這里Query String Parameters。(parameter是參數(shù)的意思)
get,post還有一點區(qū)別
響應(yīng)頭
請求頭是把瀏覽器的相關(guān)信息高速服務(wù)器,而相對相應(yīng)的就是響應(yīng)頭,響應(yīng)頭的作用就是把瀏覽器的相關(guān)信息告訴瀏覽器。
因為文件的后綴并不能代表文檔的真實內(nèi)容,那怎樣區(qū)分我們響應(yīng)的內(nèi)容到底是什么類型的呢?靠的就是content-type。就比如此處,因為content-type的值是css,所以瀏覽器就會把響應(yīng)回來的文件當(dāng)做css
來解析瀏覽之所知道是按照css執(zhí)行還是js執(zhí)行靠的就是這個content-type圖片的content-type與css,js不同因為文件通過網(wǎng)線去走傳遞的都是字符串,那么信息到了瀏覽器,瀏覽器就會犯糊涂,到底是當(dāng)做css解析還是js解析還是圖片解析,還是html去解析靠的就是content-type去區(qū)分。
總結(jié):我們網(wǎng)頁里面所有的內(nèi)容都是通過請求和響應(yīng)來完成的,HTTP協(xié)議約束的就是請求和響應(yīng),怎么約束呢?通過約定請求中需要什么內(nèi)容(如請求頭里面的各中字段如content-type等),響應(yīng)中需要什么內(nèi)容。響應(yīng)總是相同的結(jié)構(gòu),但是根據(jù)請求的不同,請求三部分中的內(nèi)容會有差別。
區(qū)別1:以post發(fā)送請求有請求主體,當(dāng)我們以get請求發(fā)送,沒有請求主體。
區(qū)別2:當(dāng)我們以post發(fā)送請求,是由content-type的。而我們以get請求發(fā)送時沒有content-type的。
根據(jù)28定則,實際開發(fā)中掌握20%的知識就足以應(yīng)對80%的工程了。事實上掌握以上內(nèi)容,對付我們工作中的Ajax請求了。
希望這篇文章能夠幫到大伙。如果喜歡本文的話可以點贊、關(guān)注以表達對我的支持。謝謝。
