什麼是http協議：
通過網際網路傳送全球資訊網文件的資料傳送協議。
目前我們使用的http版本是http/1.1其前身是http/1.0。關於兩個版本不同，下面會不時提及。在整個iso傳輸層次模型中http處於最高層次，而tcp是處於下面一層傳輸層，
也就是說http是基於tcp協議建立的連線，所以http傳輸建立之前需要先建立tcp連線，也就是三次握手，在建立tcp連線之後方可真正請求響應請求。
http傳輸過程詳解：
當我們傳送乙個ajax請求，或者位址列輸入url後，我們的瀏覽器就給web伺服器傳送乙個request，之後伺服器處理完成後返回響應的response給瀏覽器。之後瀏覽器拿到資料進行解析裡面資料從而生成我們頁面或者組裝資料。
期間傳輸還有可能經歷了**伺服器（目前很多很多**都用**伺服器，主要原因是其隱蔽。。）從而實現伺服器端檔案快取。
http傳輸是面向連線的，也就是說如果連線沒有中斷，可以繼續傳送請求，這個設定可以在請求頭connection來設定，例如：我通過乙個url請求了乙個html頁面之後，
經解析，html頁面中包含對的請求，則會直接再向伺服器發起請求而不必重新建立tcp連線。等到所有請求都就緒，方可完成一次頁面載入或者請求完畢。
http訊息結構：
整個http訊息結構分為request以及response兩部分：為了便於講解，我從w3c擷取乙個圖如下：
這是從chrome的network截圖，且不管每個瀏覽器將其如何區分，按照我們看到的來分組：
上面第一部分是請求資源位址以及請求方式屬於request部分
第二部分是返回狀態碼，屬於response部分
第三部分是request部分，第四部分是response部分。
總體來說整個請求分為兩個部分我們來分析裡面主要的結構如下：
request部分分析：
請求的url即我們位址列輸入的url或者ajax請求的那個引數url。
請求方式：常用的有get、post以及head請求：
head請求：head請求是一種返回不呈現資料的請求，也就是只請求乙個報文頭，通常用於請求乙個檔案去判斷檔案是否更新或者在我的專案中去請求伺服器時間。
get與post比較：
get請求一般都會用來查詢資源資訊，post請求一般會用來更新資源資訊。
get提交資料方式是將引數放置url之後用&來分開例如name=yuchao&age=26，
post請求可以以物件字面量形式進行引數傳輸：，所以通過post方式傳送的請求中包含內容這一項，而get請求直接將內容附在url之後
正是由於資料傳輸方式不同導致get傳輸資料量需要在url位元組限制範圍之內，而post幾乎無限制。同時get引數放置於url中也不利於安全。
accept：表示瀏覽器可以接受的型別，一般瀏覽器都會發給伺服器*表示通配所有型別。text/html型別就表示我們常說的html文件。
當我們規定了一種型別時候而伺服器沒有這種型別可以返回，則會丟擲乙個406狀態碼的錯誤(no acceptable)
accept-encoding：瀏覽器自身宣告接受的編碼方式，通常是壓縮方法；
accept-language：瀏覽器自身宣告可以接受的語言例如中文：zh-cn；
cookie:將cookie資料傳送給伺服器
connection：可選值有：
keep-alive:當乙個網頁開啟完成後，客戶端和伺服器之間用於傳輸http資料的tcp連線不會關閉，如果客戶端再次訪問這個伺服器上的網頁，會繼續使用這一條已經建立的連線，
重新向該伺服器傳送請求時候不會重新經過三次握手建立鏈結，而是直接可以進行請求，這個請求時間段可以由伺服器端keep-alive欄位進行設定，
當過了這個時間段之後沒有任何請求則關閉該連線。http1.0中預設是close，而目前應用的1.1版本中預設是keep-alive長連線。具體應用看下面response介紹該key；
connection: close 代表乙個request完成後，客戶端和伺服器之間用於傳輸http資料的tcp連線會關閉， 當客戶端再次傳送request，需要重新建立tcp連線。
user-agent：客戶端使用的瀏覽器以及作業系統
cache-control
：瀏覽器快取機制，一般會有max-age=值，或者no-cache或者public、private；
if-modified-since：
和 last-modified 一起工作瀏覽器快取內容最後修改時間;
if-none-match:和etag一起工作，比較兩者值 獲取內容是否改變。
response部分分析：
status：返回狀態碼
keep-alive:長連線設定的值，如下圖截圖：
有兩個值：timeout以及max，例如：keep-alive:timeout=5,max=100，只有當connection為keep-alive並且服務端支援時候才會生效。
其中timeout表示超時時間，max表示最大連線數。即：在5秒之內伺服器始終保持空閒連線，在這五秒之內可以傳送請求不必重新建立連線，超過這個時間則會重新建立連線進行請求。
在保持持久連線之間每傳送乙個請求max值就會減少乙個，直到為0為止則會自動斷開連線。
一般實際開發中，這個值的設定要根據具體網頁中嵌入的請求個數去設定：例如網頁中有20個，五個外部指令碼，三個css樣式表。則可以根據傳輸速度設定超時時間5-20秒之內，max值設定為30-100；
這樣設計初衷就是為了既能減少不必要的tcp連線，又能避免頻繁的請求造成伺服器連線池冗餘。
這個值從根本上來說跟前端沒有太多關係，但是在**效能優化很是關鍵。選擇多次建立tcp連線還是選擇空餘一段時間請求被浪費，就要看實際需求以及能否設定出乙個合理的keep-alive值
content-length：表示返回實體內容長度大小，一般應用在返回靜態頁面或者一張並且資料量不大時候被設定；大小為bite位元組；例如一張的請求：connent-length：630；請求乙個截圖如下：
transfer-encoding：即伺服器端不是乙個已知的固定的返回實體時候，伺服器會一邊產生資料，一邊傳送給客戶端，
這時候伺服器就需要用transfer-encoding：chunked分塊編碼來代替content-length，設定該key後content-length就失效了。
對於前段來說只需關心返回的狀態是否是成功即可，但是對於後台需要用到這個設定來判斷客戶端是否接受完全部資料。詳細請參考
date：伺服器返回資料時間，我經常就用這個值來取得伺服器時間
etag：與if-none-match配合使用；
last-modified:作用： 用於指示資源的最後修改日期和時間。一般都用來處理快取，
content-type：作用：web伺服器告訴瀏覽器自己響應的物件的型別和字符集,例如:content-type: text/html; charset=utf-8，content-type: image/jpeg
server：指明伺服器軟體版本；
ajax修改獲取header：
利用xmlhttp.setrequestheader來設定request請求頭：例如：xmlhttp.setrequestheader('cache-control','no-cache');
利用xmlhttp.getresponseheader來獲取response頭資訊;例如：xmlhttp.getresponseheader("date")；
另外 request.setcharacterencoding("utf-8")也可以設定傳送到服務端資料編碼格式（一般來說傳送的編碼格式跟服務端解析格式必須是一致的）
寫給後端的前端筆記 定位（position）
既然都寫了一篇浮動布局，乾脆把定位 position 也寫了，這樣後端基本上能學會css布局了。我們所說的定位position主要有三類 固定定位fixed，相對定位relative，絕對定位absolute。它們都有相同的四個屬性 top，bottom，left，right 主要在於他們的參照物不...
Http協議詳解 Http請求詳解
http是hypertext transfer protocol 超文字傳輸協議 的簡寫，它是tcp ip協議的乙個應用層協議，用於定義web瀏覽器與web伺服器之間交換資料的過程。客戶端連上web伺服器後，若想獲得web伺服器中的某個web資源，需遵守一定的通訊格式，http協議用於定義客戶端與w...
前端http快取
協商快取 禁用快取 指的是瀏覽器第一次請求資源時，瀏覽器快取在本地，並設定時間，如果在這個時間內再次請求，便會讀取快取的資源。對應策略為expires 和 cache control，cache control的優先順序高於expires。強制快取不會請求伺服器。expires 我們用pragma來...