如何理解客戶端與服務器cookie

這篇文章給大家介紹如何理解客戶端與服務器cookie，內容非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。

認識cookie

第一部分： 概要

　　cookie是一種早期使用的客戶端存儲機制（現在仍在廣泛使用），cookie數據會在Web瀏覽器和Web服務器之間傳輸， 因為早期cookie是針對服務器腳本設計的，所以服務端腳本可以讀、寫存儲在客戶端的cookie的值。 值得注意的是， 任何以cookie形式存儲的值，無論服務器端是否需要，每一個HTTP請求都會把這些數據（cookie數據）傳輸到服務器端。但是cookie的存儲量較小，一般不得超過4kb，即4096個字節。由于存儲能力較弱，現在比較流行的是WebStorage，

　　Cookie是訪問過的網站創建的文件，用于存儲瀏覽器信息，例如個人資料。

　　cookie的缺點：

• 數據存儲大小：4kb，作為數據存儲容器，卻只有4kb，對于目前稍微有一些繁雜的頁面，cookie就不夠用了。

• 安全性問題： cookie是在HTTP中明文傳遞的（HTTPs不是，這和協議有關，與cookie本身無關），所以說這是非常不安全的。

• 網絡負擔： 之前提到cookie會隨著HTTP請求在web瀏覽器和服務器間傳遞，這是非常浪費帶寬的。

　　HTTP Cookie，通常直接叫做cookie，標準要求服務器將Set-Cookie作為響應的一部分，其中包含會話信息，這種服務器響應報文的首部字段可能如下，其中以name為名稱、以value為值，這是要求客戶端發送name這個鍵名的cookie值，如下：

HTTP/1.1 200 OK
Content-type: Text/html
Set-Cookie: name=value
Other-header: other-header-value

　　　那么瀏覽器端的請求就是這樣的：

GET /index.html HTTP/1.1Cookie: name=value
Other-header: other-header-value

　　即把服務器需要的name的值發送到服務器端。

　　將cookie發送到服務器可以使得服務器知道關于此用戶的更多信息。

　   注意： 每一個cookie的格式都是這樣的： <cookie名> = <值>； 名稱和值都必須是合法的標識符。

 　　注意： cookie是存在有效期的， 在默認情況下，cookie的聲明周期就是在瀏覽器關閉的時候結束，如果想要使得cookie在瀏覽器關閉之后還可以用，就要為cookie設置有效期，也就是cookie的實效日期。

第二部分：cookie查看

　　我們可以使用 console.log(window.navigator.cookieEnabled) 查看我們自己瀏覽器的cookie功能是否打開，它返回一個布爾值，如果為true就說明打開了。 

　　如果打開chrome的內容設置中的“阻止網站設置任何數據”這樣我們使用上面的代碼，就可以發現cookie功能關閉了，即false。這時，客戶端就不會再存儲任何cookie了。

　　實際上cookie就是一些字符串信息，這些信息放在客戶端的計算機上，用于客戶端計算機和服務器之間傳遞信息。我們可以使用 alert(typeof document.cookie) 來檢測

　　在JavaScript中可以通過 document.cookie 來讀取或設置這些信息，由于cookie 多用在客戶端和服務器之間傳遞信息，所以除了JavaScript之外，服務器端的語言如PHP也可以存取cookie。

 　 由于cookie最終都是以文件形式存放在客戶端，所以查看和修改cookie都是十分方便的，這就是為什么常說cookie不能存放重要信息的原因。　

第三部分： 關于cookie的一些限制 

　　cookie有 域和路徑 這個概念。域就是domin 的概念，因為瀏覽器是一個主意安全的環境，所以不能域之間必然是不能互相訪問cookie的(當然可以通過跨域的方式做到就向jsonp)，路徑就是routing的概念，一個網頁所創建的cookie只能被與這個網頁在同一目錄或子目錄下的網頁訪問，而不能被其他目錄下的網頁訪問。

第四部分： Cookie常見問題

cookie存在兩種類型

• 你瀏覽的當前網站設置的cookie。

• 來自網頁上嵌入廣告或圖片等其他域來源的第三方cookie（網站通過使用這些cookie可以跟蹤你的使用信息）　　

Cookie的聲明周期大致可以分為兩種狀態：

• 其一： 即臨時性質的cookie， 當前使用的過程中網站會儲存一些你的個人信息，后面就用不到了，所以瀏覽器關閉之后這些信息就從計算機中刪除。

• 其二： 設置了失效時間的cookie，比如你的用戶名和密碼通過cookie李記錄，這樣就不需要每次都自己輸入后登陸而是直接登陸了。 可以設置保留幾天、幾十天等。

Cookie的兩種清除方式

• 瀏覽器自身的設置中清除

• 通過設置cookie的有效期

• 說明： 刪除cookie有可能導致某些網頁無法正常運行（如：我將cookie功能關閉，現在寫的博文就不能正常提交）

瀏覽器可以通過設置接受或拒絕訪問cookie，處于性能和功能的考慮，盡量降低cookie的使用數量。

假如是本地磁盤中的頁面，chrome的控制臺是無法用JavaScript讀寫操作 cookie 的，解決辦法...換一個瀏覽器^_^。

第五部分： cookie基礎用法

一、 簡單的存取操作

　　使用js存取cookie時，必須使用document的cookie屬性，如下：

document.cookie = 'username=zzw';

 注意： 其中username就是cookie的名稱，zzw就是這個名稱對應的值。 假設 cookie 名稱并不存在，那么就是創建一個新的 cookie；如果存在就是修改了這個 cookie 名稱對應的值。如果要多次創建 cookie ，重復使用這個方法即可。

　　我們還可以通過document.cookie.length來查看有多少對這樣的cookie。

二、 cookie的讀取操作

　　下面的代碼是w3school上的例子

function getCookie(c_name){
　　　　if (document.cookie.length>0){　　//先查詢cookie是否為空，為空就return ""　　　　　　c_start=document.cookie.indexOf(c_name + "=")　　//通過String對象的indexOf()來檢查這個cookie是否存在，不存在就為 -1　　　　　　　　if (c_start!=-1){ 
　　　　　　　　c_start=c_start + c_name.length+1　　//最后這個+1其實就是表示"="號啦，這樣就獲取到了cookie值的開始位置　　　　　　　　c_end=document.cookie.indexOf(";",c_start)　　//其實我剛看見indexOf()第二個參數的時候猛然有點暈，后來想起來表示指定的開始索引的位置...這句是為了得到值的結束位置。因為需要考慮是否是最后一項，所以通過";"號是否存在來判斷　　　　　　　　if (c_end==-1) c_end=document.cookie.length　　
　　　　　　　　return unescape(document.cookie.substring(c_start,c_end))　　//通過substring()得到了值。想了解unescape()得先知道escape()是做什么的，都是很重要的基礎，想了解的可以搜索下，在文章結尾處也會進行講解cookie編碼細節　　　　　　} 
　　　　}
　　　　return ""　　}

　　可以看得出來，這實際上就是對字符串進行操作。

三、設置cookie的有效期

　　默認情況，cookie在瀏覽器關閉就實效了，但是我們可以通過下面的方式來設置有效期：

document.cookie = "name=value;expires=date"

　　上面的data值為GMT時間（格林威治時間）的日期型字符串，生成方式如下：

var _date = new Date();

_date.setDate(_date.getDate()+30);

_data.toGMTString();

　　直接在本機上運行，結果是："Fri, 21 Apr 2017 19:21:11 GMT"

　　我們通過 +30 就可以設置cookie的有效時間是30天了。注意:setDate和getDate的使用。

第六部分： Cookie路徑概念

　　默認情況下，只有與創建 cookie 的頁面在同一個目錄或子目錄下的網頁才可以訪問，這個是因為安全方面的考慮，造成不是所有頁面都可以隨意訪問其他頁面創建的 cookie。　　

　　如：在 "http://www.cnblogs.com/Darren_code/" 這個頁面創建一個cookie，那么在"/Darren_code/"這個路徑下的頁面如： "http://www.cnblogs.com/Darren_code/archive/2011/11/07/Cookie.html"這個頁面默認就能取到cookie信息，因為這個頁面時上面的路徑的子目錄下的頁面。而因為"http://www.cnblogs.com"或者 "http://www.cnblogs.com/xxxx/"不是在同一個目錄下，所以不能訪問cookie了。

第七部分： Cookie安全性

　　之前說到，cookie在報文和本地文件中，都可以看到，所以不能存放重要的信息，他們都是不安全的。但是cookie中傳遞的內容非常重要，就要用加密的方式來傳輸數據。 

　　即如果把cookie的屬性名稱為secure，默認的值為空，那么它和服務器之間就會通過https或其他的安全協議傳輸數據，如下：

document.cookie = "username=zzw;secure"

 值得注意的是： 這樣只能保證cookie和服務器之間的數據傳輸是加密的，但是本地文件依舊沒有加密。所以本地的cookie還是很容易看到的。

第八部分： cookie編碼細節

　　在輸入cookie信息時不能包含空格、分號、逗號等特殊符號。 而在一般情況下，cookie都是采用未編碼的方式。 所以，在設置cookie之前應當使用escape()函數先將cookie進行編碼，在獲取到cookie的時候使用unescapse（）函數把值進行轉換回來。

關于如何理解客戶端與服務器cookie就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。