客戶(hù)端存儲(chǔ)——Cookie

BothEyes1993 發(fā)布于2019-08-22 15:00 / 1962人閱讀

摘要：如包含這個(gè)域名下面的所有子域，例子中是對(duì)應(yīng)的子域路徑指定域名中特定的路徑才能訪問(wèn)失效時(shí)間指定停止向服務(wù)器發(fā)送的時(shí)間，如果沒(méi)有設(shè)置或者設(shè)置的是以前的時(shí)間，瀏覽器就在結(jié)束會(huì)話的時(shí)候刪除掉所有的值安全標(biāo)志只有使用協(xié)議才可以發(fā)送原生實(shí)現(xiàn)的增刪改查

Cookie

性質(zhì)

響應(yīng)時(shí)：服務(wù)器會(huì)設(shè)置set-Cookie字段返回給客戶(hù)端

請(qǐng)求時(shí)：瀏覽器會(huì)將值保存在請(qǐng)求域名對(duì)應(yīng)的cookie當(dāng)中進(jìn)行發(fā)送

限制

域名設(shè)置一個(gè)cookie以后，每次向這個(gè)域名發(fā)送請(qǐng)求時(shí)都會(huì)包含這個(gè)cookie

在同一域名下，本地存儲(chǔ)的cookie數(shù)量是有限的

構(gòu)成
舉例：Set-Cookie：name=value；expires=Mon，22-Jan-07 07:10:24 GMT；domain=.baidu.com; path=/; secure

名稱(chēng)（name）：用來(lái)表示一個(gè)唯一確定的Cookie,進(jìn)行url編碼

值（value）：存儲(chǔ)在Cookie中的字符串值，進(jìn)行url編碼
ps:url編碼有三種方法

（1）escape/uescape:進(jìn)行unicode字符編碼與解碼
（2）encodeURI/decodeURI：對(duì)特殊字符不進(jìn)行編碼
（3）encodeURIComponent/decodeURIComponent:對(duì)特殊字符也會(huì)進(jìn)行編碼

域（domain）：表示哪個(gè)域名設(shè)置的Cookie，所有向這個(gè)域名發(fā)送的請(qǐng)求都會(huì)包含這個(gè)Cookie，可以是一個(gè)域名也可以是一個(gè)子域。如：baidu.com（包含這個(gè)域名下面的所有子域：www.baidu.com、im.baidu.com），例子中是對(duì)應(yīng)的子域

路徑（path）：指定域名中特定的路徑才能訪問(wèn)cookie

失效時(shí)間（expires）：指定停止向服務(wù)器發(fā)送cookie的時(shí)間，如果沒(méi)有設(shè)置或者設(shè)置的是以前的時(shí)間，瀏覽器就在結(jié)束會(huì)話的時(shí)候刪除掉所有的cookie值

安全標(biāo)志（secure）：只有使用https協(xié)議才可以發(fā)送cookie

原生實(shí)現(xiàn)cookie的增刪改查

const CookieUtil = {
      get:function(name){
        const cookie = document.cookie;

        const cookieName = encodeURIComponent(name) + "=";
        const cookieStart = cookie.indexOf(cookieName);
        let cookieValue = null;

        if(start > -1){
            let cookieEnd = cookie.indexOf(";", cookieStart);

            if(cookieEnd === -1){
                  cookieEnd = cookie.length;
            }

            cookieValue = cookie.substring(cookieStart+cookieName.length, cookieEnd);
        }

        return cookieValue;
      },
      
      set:function(name, value, expires, domain, path, secure){
         let cookieText = encodeURIComponent(name) + "=" + encodeURIComponent(value);

         if(expires){
            cookieText += "; expires=" + expires.toUTCString();
         }

         if(domain){
            cookieText += "; domian=" + domain;   
         }

         if(path){
            cookieText += "; path=" + path;
         }

         if(secure){
             cookieText += "; secure";  
         }

         document.cookie = cookieText;
         console.log(document.cookie);
      },
      
      delete:function(name, domian, path, secure){
        this.set(name, "", new Date(0), domian, path, secure);
      }
}