如何使用cookie

cookie是保存在客戶端系統(tǒng)中的一個(gè)文本文件，都與指定的Web服務(wù)器的域中的固定目錄相關(guān)聯(lián)。
當(dāng)瀏覽器向服務(wù)器請求該目錄下的頁面時(shí)，關(guān)聯(lián)的cookie信息就會隨著HTTP請求以頭部信息的方式發(fā)送給服務(wù)器。
在客戶端，用戶可以使用JavaScript讀寫cookie信息，服務(wù)器端腳本也能夠編輯這些cookie信息。

cookie的優(yōu)點(diǎn)主要表現(xiàn)

• 簡單易用

• 瀏覽器負(fù)責(zé)發(fā)送數(shù)據(jù)

• 瀏覽器自動管理不同站點(diǎn)的cookie
  經(jīng)過長期使用，cookie也越來越暴露出先天的不足，具體說明如下

• 使用簡單的文本文件儲存數(shù)據(jù)，安全性很差，很容易被黑客竊取

• cookie 中存儲的數(shù)據(jù)容量有限，其上限為4KB

• 存儲cookie的數(shù)量有限，多數(shù)瀏覽器上限為30或50個(gè)，如IE6只支持每個(gè)域名20個(gè)cookie，也有部分瀏覽器存儲cookie的數(shù)量高達(dá)300個(gè)

• 如果瀏覽器的安全配置為最高級別，則cookie會失效

• cookie不適合大數(shù)據(jù)的儲存，因?yàn)閏ookie會由每個(gè)服務(wù)器的請求來傳遞，從而造成cookie速度緩慢、效率低下

寫入cookie信息

• 使用 document.cookie 可以讀寫cookie字符串信息
• cookie字符串是一組明值對，名稱和值之間以等號相連，名值對之間使用分號進(jìn)行分隔。值中不能包含分號、逗號和空白符。如果包含特殊字符，必須使用 escape()函數(shù)對其進(jìn)行編碼，在讀取cookie時(shí)也必須使用unescape()函數(shù)進(jìn)行解碼。

如何使用cookie存儲cookie信息

var d = new Date();
d = d.toString();
d = "date=" + escape(d);  // 設(shè)置 cookie字符串
document.cookie = d;   //  寫入cookie

在默認(rèn)狀態(tài)下，cookie信息只能在當(dāng)前會話期（當(dāng)前瀏覽器窗口）中有效并存在，一旦結(jié)束會話（關(guān)閉瀏覽器窗口），這些cookie信息就會被自動刪除。
如果長久保存cookie信息，可以設(shè)置expires屬性，把字符串"expires=date" 附加到cookie字符串后面，用法如下

name = value; expires = date
date為格林威治日期時(shí)間（GTM）格式：Sun，30 Apr 2017 00:00:00 UTC
使用 Date.toGMTString()方法可以快速把時(shí)間對象轉(zhuǎn)換為GTM格式。

創(chuàng)建一個(gè)有效期為一個(gè)月的cookie

var d = new Date();     // 實(shí)例化當(dāng)前日期對象
d.setMonth(d.getMonth() + 1);  // 提取月份值并加1，然后重新設(shè)置當(dāng)前日期對象
d = "date=" + escape(d) + ";expires=" +d.toGMTString();  // 在cookie字符串的尾部添加expires 名值對

document.cookie = d;  // 寫入cookie

cookie 信息是有域和路徑限制的。在默認(rèn)情況下，僅在當(dāng)前頁面路徑內(nèi)有效。其它域或本域其它目錄中的文件是無權(quán)訪問的。
用戶可以使用cookie 的 path和domain屬性重設(shè)可見路徑和作用域。

name = value; expires=date; domain=domain; path=path;

如果設(shè)置 path=/, 可以設(shè)置cookie信息與服務(wù)器根目錄與其子目錄相關(guān)聯(lián)，從而實(shí)現(xiàn)在整個(gè)網(wǎng)站中共享cookie信息；如果只想讓bbs目錄下的頁面訪問，可以設(shè)置path=/bbs即可。

很多網(wǎng)站包含多個(gè)域名 ，在默認(rèn)情況下，cookie信息只能在本域中訪問，通過設(shè)置cookie的domain屬性可修改域的范圍。domain = baidu.com即可。這樣所有baidu.com 的所有子域下的所有頁面相關(guān)聯(lián)，包括www、news、tieba等。

cookie使用secure屬性定義cookie信息的安全性。secure屬性取值包括secure或者空字符串。在默認(rèn)情況下，secure屬性值為空，也就是說cookie信息使用不安全的HTTP鏈接傳遞數(shù)據(jù)。如果一個(gè)cookie設(shè)置了secure，那么cookie信息在客戶端與Web服務(wù)器之間傳遞時(shí)，就通過HTTPS或者其他安全協(xié)議傳遞數(shù)據(jù)

綜上所述，比較完善的cookie信息字符串應(yīng)該包括下面幾個(gè)部分

• cookie信息字符串，包含一個(gè)名/值對，默認(rèn)為空
• cookie有效期，包含一個(gè)GTM格式的字符串，默認(rèn)為當(dāng)前會話期（即如果沒有設(shè)置，則當(dāng)關(guān)閉瀏覽器時(shí)，cookie信息就因過期而被清除）
• cookie有效路徑，默認(rèn)為cookie所在頁面目錄及其子目錄
• cookie有效域，默認(rèn)為設(shè)置cookie的頁面所在的域
• cookie安全性，默認(rèn)為不采用安全加密措施進(jìn)行傳遞

下面把寫入cookie信息的實(shí)現(xiàn)代碼進(jìn)行封裝

//  寫入cookie
//  參數(shù) name表示cookie名稱，value表示cookie值，expirs表示有效天數(shù)，path表示有效路徑，domain表示域，secure表示安全性設(shè)置。其中name、value、path、和domain參數(shù)為字符串類型，傳遞時(shí)需要加上引號，而參數(shù)expirs為數(shù)值，secure表示布爾值，表示是否加密傳輸cookie信息
//  返回值：無

function setCookie（ name，value，expires，path，domain，secure）{
     var today = new Date（）;
     today.setTime（ today.getTime()）;
     if（expires）{
        expires = expires * 1000 * 60 * 60 * 24;
     }
     
     var expires_date = new Date（ tody.getTime() + (expires) ）;
     document.cookie = name + "=" + escape(value) +
       ( (expires) ? ";expires=" + expires_date.toGTMString()  : "" )  +
       ( (path) ? ";path=" + path : ""  ) +
       ( (domain) ? ";domain="  +domain : "") +
       ( (secure) ? ";secure="  : "" );

}

讀取cookie信息

訪問 document.cookie可以讀取cookie信息，cookie屬性值是一個(gè)由零個(gè)或多個(gè)名值對的字符串組成的字符串列表，每個(gè)名值對之間通過分號進(jìn)行分隔。

把cookie字符串轉(zhuǎn)換成對象類型

//  把cookie字符串轉(zhuǎn)換為對象類型
//  參數(shù)：無
//  返回值：對象，儲存cookie信息，其中名稱作為對象的屬性而存在，而值作為屬性值而存在

function getCookie（）{       
   var  a  =  document.cookie.split(";");   //  把cookie字符串分為數(shù)組
   var  o  = { };                        //  臨時(shí)對象直接量
   for（var i = 0；i<a.length; i++）{    //  遍歷數(shù)組
        var  v = a[i].split("=");       //  劈開每個(gè)數(shù)組元素
        o[v[0]] = v[1];      //  把元素的名和值轉(zhuǎn)換為對象的屬性和屬性值
   
   }
    return o;     //  返回對象
}

如果寫入cookie進(jìn)行了編碼，讀取時(shí)要記得解碼

===================

// 在實(shí)際開發(fā)中，更多的操作是直接讀取某個(gè)cookie值，而不是讀取所有cookie信息。

// 讀取指定cookie信息
// 參數(shù)：cookie名稱
// 返回值：cookie值

function getCookie（name）{
       var start = document.cookie.indexOf（name + " = "）; // 提取cookie中與名稱相同的字符串索引
       var len = start + name.length + 1;  // 計(jì)算值的索引位置
       if（（！start）&&（name！=document.cookie.subString（0，name.length）））{
       // 不存在則返回null    此處的判斷就是需要注意0是false
       return  null；
       }
       if（start == -1） return null；  //  如果沒有找到，則返回null
       var end = document.cookie.indexOf（";"，len）；//  獲取值后面“；”的索引位置
       if（end == -1） end = documen.cookie.length; // 如果索引值為-1，設(shè)置為cookie字符串的長度
       return unescape（documen.cookie.substring（len，end））；//  獲取名稱對應(yīng)的截取值，并解碼返回
}

修改和刪除cookie信息

如果要改變指定cookie的值，只需要使用相同名稱和新值重新設(shè)置該cookie即可。如果要?jiǎng)h除某個(gè)cookie信息，只需要為該cookie設(shè)置一個(gè)已過期的expires屬性值

//  封裝一個(gè)刪除指定cookie信息的方法，這個(gè)方法需要調(diào)用getCookie（）函數(shù)

// 刪除指定cookie 信息
// 參數(shù)：name表示cookie名稱，path表示所在路徑，domain表示所在域
// 返回值

function deleteCookie（name，path，domain）{
    if（getCookie（name）） document.cookie = name + " = "+  //  如果名稱存在，則清空
     （（path）？";path=" + path : ""）+   // 如果存在路徑，則加上
     （（domain）？ ";domain=" +domain : ""）+  // 如果存在域，則加上
     "expires=Thu，01-Jun-1970 00:00:01 GTM";
     // 設(shè)置有效期為過去時(shí)，即表示該cookie無效，將會被瀏覽器清除
}

附加cookie信息

切記請勿濫用cookie瀏覽器對cookie都有個(gè)數(shù)限制，為了避免超出這個(gè)限制，可以把多條信息都保存在一個(gè)cookie中，而不是為每條信息都新建一個(gè)cookie。由于cookie可存儲的字符串最大長度為4kb（即4096個(gè)字符）

//  在cookie中存儲更多的信息。

//  定義有效期
var d = new Date（）；
d.setMonth（d.getMonth() + 1）;
d = d.toGMTString();
// 定義cookie字符串
var a = " name：a，age：20，addr：beijin"  //子名/值串
var c = "user=" + escape(a)    // 組合cookie字符串
c += ";" + "expires=" +d;   // 設(shè)置有效期為1個(gè)月
document.cookie = c;   //  寫入cookie信息