cookie

cookie，有時候也用其複數形式Cookies，指某些網站為了辨別使用者身份，進行session跟蹤而儲存在使用者本地終端上的資料（經常通過加密）。定義於RFC2109和2965都已廢棄，最新取代的規範是RFC6265。

cookie的作用

伺服器可以利用Cookie包含資訊的任意性來篩選經常性維護這些資訊，以判斷在HTTP傳輸中的狀態。Cookie最典型的英語是判斷註冊使用者是否已經登入網站，使用者可能會得到提示，是否在下一次進入此網站時保留使用者資訊以便簡化登入步驟，浙西都是Cookie的功能。另一個重要張合是“購物車”之類處理。使用者可能會在一段時間內在同一家網站的不同頁面中選擇不同的商品，這些資訊都會寫入Cookie，以便在最後付款時提取資訊。

js設定cookie

document.cookie="key=value";
//例
document.cookie="name=weiqi";

//可以在控制檯中打印出cookie
console.log(document.cookie);

如何修改和獲取cookie

js中並沒有提供獲取cookie的方法，所以只能自己封裝方法，相同的key的cookie只能存在一個，如果定義了一個document.cookie="age=21",後面又定義了document.cookie="age=30"，那麼後面定義的cookie會覆蓋前面定義的cookie，所以修改cookie值的時候只用重新定義個key相同的cookie就可以了。那麼獲取cookie的時候也只用在cookie中獲取到這個key後面的“=”和“；”直接的字串，那就是這個cookie的值了，獲取的方法又很多種，這裡我寫一種比較簡單的：

function getCookie(key){
    var index = document.cookie.indexOf(key);
    var returnValue;
    if(index!==-1){
        var tIndex = document.cookie.indexOf(";",index);
        var target = document.cookie.substring(index,tIndex);
        var returnValue = decodeURIComponent(target.replace(key+"="
 
,""))
    }
    return returnValue;
}

document.cookie="name=weiqi";
getCookie("name");  //weiqi

刪除cookie

cookie是有有效期的，前面我們設定cookie的時候都沒有設定有效期，如果我們將cookie的有效期設定成一個已經過去的時間，那麼它就無效了，下面來實現一下：

function delCookie(key){
    var d = new Date();
    document.cookie=key+"=;expires="+ d.toGMTString();
}

document.cookie="name=weiqi";
delCookie("name");  //undefined

給cookie設定一個有效期

通過expires給cookie設定一個有效期，現在我們設定一個cookie的有效期是10天，如下：

var d = new Date();
var time = 10;
d.setTime(d.getTime()+time*1000*60*60*24);
document.cookie="name=weiqi;expires="+ d.toGMTString();

封裝cookie

將自定義的一些方法完善一下封裝成一個物件，這樣在使用的時候就可以直接拿來用了：

//封裝cookie方法的物件
var cookie = {
    setCookie:function(key,value,time){
        if(key == undefined){
            return;
        }
        if(time!== undefined){
            var d = new Date();
            d.setTime(d.getTime()+time*1000*60*60*24);
            document.cookie=key+"="+value+";expires="+ d.toGMTString();
        }else{
            document.cookie=key+"="+value;
        }
    },
    getCookie:function(key){
        var index = document.cookie.indexOf(key);
        var returnValue;
        if(index!==-1){
            var tIndex = document.cookie.indexOf(";",index);
            var target = document.cookie.substring(index,tIndex);
            var returnValue = decodeURIComponent(target.replace(key+"=",""))
         }
        return returnValue;
    },
    delCookie:function(key){
        var d = new Date();
        document.cookie=key+"=;expires="+ d.toGMTString();
    }
}


//測試
cookie.setCookie("home")
cookie.setCookie("name","衛旗");
cookie.setCookie("age",22);
cookie.setCookie("sex","男")
cookie.getCookie("sex")
cookie.delCookie("age")