什麼是cookie？

cookie 是本地計算機的臨時儲存。

作用：在瀏覽器中進行資料的儲存,使用者名稱、密碼（比如：儲存頁面資訊，自動登入等）。

特點：

• cookie需要在伺服器環境下執行；
• cookie的容量在4kb左右，限制為每個域名50個cookie個數(IE)，不同瀏覽器容量和個數不同；
• cookie以字串型別儲存，不同域名儲存的資料是無法共享；
• cookie預設是臨時儲存的，當瀏覽器關閉時，自動銷燬；
• cookie可以被禁用也可以刪除，且安全性不高。
• 可以對cookie值進行加密(MD5);

讀取和設定cookie

document.cookie = "user=123456";

console.log(document.cookie); //user=123456

使用f12檢視當前頁面儲存的cookie

注意：

在開啟網址時或者提交表單時自動裹挾著cookie資料傳送到伺服器，並且服務端程式可以 繼續裹挾著新的cookie內容儲存在你的電腦的cookie中。

設定cookie的生存期

　　格式：document.cookie = “名稱=值；expires=” + 時間；（時間必須是一個字串）。

var date=new Date();
date.setHours(date.getHours()+1);//設定1小時的生存期
// document.cookie="a=3"; //先存入a=3，只執行第一次
console.log(document.cookie);
var a=Number(document.cookie.split("=")[1]);
a++;
document.cookie="a="+a+";expires="+date.toUTCString();

　　上面程式碼表示：設定cookie在當前時間的一個小時後過期，第一次執行先存入a為3的值，然後把cookie的值從字串轉為數值型，再進行累加，每次設定生存期都要把data物件轉為字串型別(toUTCString)。

在生存期內的cookie，關閉頁面不會銷燬，生存期結束，關閉頁面銷燬cookie；

cookie儲存多個數據

var obj={
      user:"xietian",age:30,sex:"男"
    }
    function setCookie(obj,date){
      for(var prop in obj){
        document.cookie=prop+"="+obj[prop]+(date ? ";expires="+date.toUTCString() : "");
      }
    }
    var date=new Date();
    date.setFullYear(2021); 
    setCookie(obj,date);

使用reduce獲取多個cookie值

var o=getCookie();
   console.log(o);
    function getCookie(){
      return document.cookie.split("; ").reduce((value,item)=>{
          var arr=item.split("=");
          value[arr[0]]=isNaN(arr[1]) ? arr[1] : Number(arr[1]);//數字(年齡)需要轉為數值型
          return value;
      },{});
    }

關於cookie安全

　　XSS攻擊：XSS攻擊通常指的是通過利用網頁開發時留下的漏洞，通過巧妙的方法注入惡意指令程式碼到網頁，使使用者載入並執行攻擊者惡意製造的網頁程式(百度百科)。

　　XSS攻擊需要具備的條件：

1. 必須是同一個域當中頁面的表單提交，必須有文字內容提交

2. 提交的內容需要被放置在頁面中，例如評論等內容

3. 在提交的文字中出現script標籤，並且這個標籤沒有被替代，直接放入在頁面中

4. 這個頁面可以被所有使用者檢視到

5. 這個script標籤具備一定的盜竊cookie特徵

　　解決辦法

提交頁面時將script標籤過濾再提交；

但可以通過插入圖片的超連結，點選是執行JavaScript指令碼； 遇到這種時就需要將JavaScript指令碼替換

關於cookie安全還要其他攻擊方式這裡只簡單介紹一下cookie，深入瞭解請上網查詢資料。

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。