關注專欄，帶你學透JavaScript
前言
在前端面試中，cookies是經常被提及的內容，基本每家公司都會有涉及，如果你經常訪問國外的一些網站的話，會遇到彈出獲取cookies的對話框，由此可見cookies在 實際應用中是無比重要的！！！
Cookies
Cookies是服務器發送給用戶瀏覽器的一塊保存在本地的資料，當用戶下一次訪問服務器的時候，會被發送到服務器，客戶端Cookies的存盤大小為4k，
作用
- 用來進行會話狀態管理，例如記錄用戶的登錄狀態
- 用來記錄跟蹤用戶的行為
常用屬性
Expires/Max-Age
主要是用來設定Cookies的有效期，
Expires用于執行具體的過期事件，
例如在Node做為服務端，我們可以使用：
res.setHeader('Set-Cookie', [
`name=keliq; expires=${new Date(Date.now() + 36000 ).toGMTString()}`,
])
Max-Age 以秒為單位設定多少秒之后過期：
res.setHeader('Set-Cookie', ['name=picker; max-age=10;'])
如果同時設定Expires和Max-Age，則Max-Age生效，
Secure
當Secure 設定為true時，只要服務器使用SSL和HTTPS 時，客戶端才能收到Cookies
res.setHeader('Set-Cookie', ['Secure-true;'])
HttpOnly
當HttpOnly設定為true時，客服端無法使用JavaScript來獲取Cookies，
res.setHeader('Set-Cookie', ['httpOnly=true;',])
JavaScript設定cookie
設定/修改
document.cookie=“name=123”;
注意：
document.cookie="name=syl; age=18"
這樣的話只有name生效，即每次只能設定一個，因此需要封裝或者多次呼叫，
封裝
設定
//設定cookies
function setCookie(name,value,MyDay){
var ExDate = new Date();
ExDate.setDate(ExDate.getDate() + MyDay);//如果需要時間的話以這樣獲取，
document.cookie = name + "=" + value + ";expires=" + ExDate;
}
獲取
//獲取cookies
function getCookie(name){
//例如cookie是"username=abc; password=123"
var arr = document.cookie.split('; ');//用“;”和空格來劃分cookie
for(var i = 0 ;i < arr.length ; i++){
var arr2 = arr[i].split("=");
if(arr2[0] == name){
return arr2[1];
}
}
return "";//整個遍歷完沒找到，就回傳空值
}
洗掉
//洗掉cookies
function removeCookie(name){
setCookie(name, "1", -1)//第二個value值隨便設個值，第三個值設為-1表示：已經過期，
}
缺點
以下缺點，來自百科
-
Cookie在某種程度上說已經嚴重危及用戶的隱私和安全，其中的一種方法是：一些公司的高層人員為了某種目的（譬如市場調研）而訪問了從未去過的網站（通過搜索引擎查到的），而這些網站包含了一種叫做網頁臭蟲的圖片，該圖片透明，且只有一個像素大小（以便隱藏），它們的作用是將所有訪問過此頁面的計算機寫入Cookie，而后，電子商務網站將讀取這些Cookie資訊，并尋找寫入這些Cookie的網站，隨即發送包含了針對這個網站的相關產品廣告的垃圾郵件給這些高級人員，
-
雖然Cookie沒有中電腦病毒那么危險，但它仍包含了一些敏感訊息：用戶名、電腦名、使用的瀏覽器和曾經訪問的網站，用戶不希望這些內容泄漏出去，尤其是當其中還包含有私人資訊的時候，
這并非危言聳聽，跨站點腳本（Cross site scripting）可以達到此目的，在受到跨站點腳本攻擊時，Cookie盜賊和Cookie投毒將竊取內容，一旦Cookie落入攻擊者手中，它將會重現其價值，
- Cookie盜賊：搜集用戶Cookie并發給攻擊者的黑客，攻擊者將利用Cookie訊息通過合法手段進入用戶帳戶，
- Cookie投毒：一般認為，Cookie在儲存和傳回服務器期間沒有被修改過，而攻擊者會在Cookie送回服務器之前對其進行修改，達到自己的目的，例如，在一個購物網站的Cookie中包含了顧客應付的款項，攻擊者將該值改小，達到少付款的目的，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/337727.html
標籤：其他