摘要：為了解決這個問題，引入了機制。一寫入寫入主要設(shè)置五個字段，內(nèi)容有效期域名路徑是否安全傳輸。被修改為要刪除，只需將該有效期設(shè)置到當(dāng)前時間以前即可。其中有效期單位為天。

在他處看到一篇好文章，想記錄在自己的學(xué)習(xí)筆記中，原文作者看到我轉(zhuǎn)載若是介意，聯(lián)系我立馬就刪除，附上原文鏈接：
http://blog.csdn.net/sunhengzhe/article/details/46694039

首先要明確一下cookie的概念，因為HTTP協(xié)議是一種無狀態(tài)協(xié)議，也就是說一旦服務(wù)器和客戶端的數(shù)據(jù)交換完畢后，他們之間的連接就會被斷開，再次交換數(shù)據(jù)的時候就需要再次建立連接，這就意味著服務(wù)器無法從連接上判斷客戶端。
為了解決這個問題，W3C引入了cookie機制。cookie就好比一個身份證，客戶端請求服務(wù)器的時候，服務(wù)器將這個身份證頒發(fā)給客戶端，客戶端（瀏覽器）將這個身份證保存在本地，當(dāng)下次連接服務(wù)器時，客戶端攜帶這個身份證請求服務(wù)器，服務(wù)器根據(jù)身份證即可確定用戶身份。
cookie不僅客戶端能訪問到，因為客戶端請求服務(wù)器的時候會將cookie放在請求頭里帶到服務(wù)器，所以服務(wù)器也能對cookie進行操作，這里討論使用javascript在客戶端對cookie進行操作的方法。

寫入cookie主要設(shè)置五個字段，內(nèi)容、有效期、域名、路徑、是否安全傳輸。

cookie是以鍵值對形式保存的，要新建一個名為name，值為zhangsan的cookie就是“name=zhangsan”，只需將這個cookie賦值給document.cookie即可：

document.cookie = "name=zhangsan";  //添加cookie

document.cookie有讀和寫兩種形式，上面這個形式便是寫形式，寫形式代表添加cookie，且一次只能添加一條cookie，要添加多條則需要調(diào)用多次。如

document.cookie = "name=zhangsan;age=10"; //無效，只添加了name，忽略age
document.cookie = "age=10";  //添加age

默認情況下，cookie在關(guān)閉瀏覽器的時候就會被清除，想讓cookie存放更長時間可以通過設(shè)置expires字段實現(xiàn)。
expires字段需要的值是GMT(格林威治時間)格式的日期型字符串，可以用Date對象得到：

var date = new Date();
//將時間設(shè)置成30分鐘以后
date.setTime(date.getTime() + 30 * 60 * 1000);
//name=zhangsan將在30分鐘后過期
document.cookie = "name=zhangsan;expires="+date.toGMTString();

想調(diào)整過期時間，只需要改動setTime一行的代碼。

處于安全性的考慮，cookie是具有不可跨域性的，用戶訪問百度的時候，百度為客戶端頒發(fā)了一個cookie，用戶再去訪問谷歌，谷歌給客戶端頒發(fā)一個cookie，那么百度和谷歌是不能訪問到彼此的cookie的。
但是一般來說，我們訪問baidu.com的時候會發(fā)現(xiàn)，你是可以訪問到map.baidu.com的cookie的，這是因為給cookie設(shè)置了domian屬性，因為map.baidu.com和baidu.com具有同樣的域名baidu.com，所以可以為cookie設(shè)置domian值為baidu.com

document.cookie = "name=zhangsan;domain=baidu.com";

同樣道理，blog.csdn.net是訪問不到blog.csdn.net/sunhengzhe里面的cookie的（但反過來可以），為了使上級目錄訪問到下級目錄，在blog.csdn.net/sunhengzhe里新建cookie時，可以為cookie設(shè)置path屬性，一般可以直接將其設(shè)置為根目錄

document.cookie = "name=zhangsan;path=/";

cookie是保存在客戶端本地的，所以查看cookie是很方便，這也暴露了cookie的不安全性，所以一般cookie不存放如密碼等重要信息，secure屬性并不是用來設(shè)置cookie內(nèi)容的安全性的，而是用于傳輸過程中的安全，設(shè)置secure后，只保證 cookie 與服務(wù)器之間的數(shù)據(jù)傳輸過程加密，而保存在本地的 cookie文件并不加密。所以如果是想讓本地保存的cookie也加密的話，最好在保存cookie值的時候就保存加密后的數(shù)據(jù)。

document.cookie = "name=zhangsan;secure";

讀取cookie使用到document.cookie的讀模式，返回的就是所有的cookie，中間用分號隔開。

document.cookie = "name=zhangsan";  //寫
document.cookie = "age=10";  //寫
console.log(document.cookie);  //輸出 name=zhangsan; age=10

cookie并不提供刪除、修改的方法，如果想修改某項cookie，只需添加一個同名cookie，新的值將覆蓋舊的值。

document.cookie = "name=zhangsan";
document.cookie = "name=lisi";  //name被修改為lisi

要刪除cookie，只需將該cookie有效期設(shè)置到當(dāng)前時間以前即可。

var date = new Date();
//設(shè)置為前一毫秒（多前都可以）
date.setTime(date.getTime() - 1);
//刪除name
document.cookie = "name=lisi;expires=" + date.toGMTString();

使用原生方法對cookie操作是有些麻煩的，我們可以將其封裝起來，name代表鍵名，value代表值，不填則為讀取名為name的值，option代表設(shè)置值如有效期等。其中有效期單位為天。

function cookie(name, value, options) {
    if (typeof value != "undefined") {
        options = options || {};
        //如果值為null, 刪除cookie
        if (value === null) {
            value = "";
            options = {
                expires: -1
            };
        }
        //設(shè)置有效期
        var expires = "";
        if (options.expires && (typeof options.expires == "number" || options.expires.toGMTString)) {
            var date;
            if (typeof options.expires == "number") {
                date = new Date();
                date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
            } else {
                date = options.expires;
            }
            expires = ";expires=" + date.toGMTString();
        }
        var path = options.path ? ";path=" + (options.path) : "";
        var domain = options.domain ? ";domain=" + (options.domain) : "";
        var secure = options.secure ? ";secure" : "";
        //設(shè)置cookie
        document.cookie = [name, "=", encodeURIComponent(value), expires, path, domain, secure].join("");
    } else {
        //讀取cookie
        if (document.cookie.length > 0) {
            var start = document.cookie.indexOf(name + "=")
            if (start != -1) {
                start = start + name.length + 1;
                var end = document.cookie.indexOf(";", start);
                if (end == -1){
                    end = document.cookie.length;
                }
                return decodeURIComponent(document.cookie.substring(start, end));
            }
        }
        return ""
    }
}

cookie("name", "zhangsan"); //添加name=zhangsan
cookie("name", null); // 刪除name
cookie("age", "10", {
    expires: 30
}); // 添加age=10且有效期30天