關于Cookie的簡單總結

EscapedDog 發布于2019-08-22 16:48 / 1006人閱讀

摘要：通常，它用于告知服務端兩個請求是否來自同一瀏覽器，如保持用戶的登錄狀態。使基于無狀態的協議記錄穩定的狀態信息成為了可能。另外，的過期時間域路徑有效期適用站點都可以根據需要來指定。

Cookie簡介

HTTP Cookie（也叫Web Cookie或瀏覽器Cookie）是服務器發送到用戶瀏覽器并保存在本地的一小塊數據，它會在瀏覽器下次向同一服務器再發起請求時被攜帶并發送到服務器上。通常，它用于告知服務端兩個請求是否來自同一瀏覽器，如保持用戶的登錄狀態。Cookie使基于無狀態的HTTP協議記錄穩定的狀態信息成為了可能。

Cookie主要用于以下三個方面:

回話狀態管理(例如用戶登錄狀態 , 購物車等)

個性化設置(如用戶自定義設置,主題等)

瀏覽器行為跟蹤 (如跟蹤分析用戶行為等)

創建Cookie

當服務器收到HTTP請求時，服務器可以在響應頭里面添加一個Set-Cookie選項。瀏覽器收到響應后通常會保存下Cookie，之后對該服務器每一次請求中都通過Cookie請求頭部將Cookie信息發送給服務器。另外，Cookie的過期時間、域、路徑、有效期、適用站點都可以根據需要來指定。

Set-Cookie: =

HTTP/1.0 200 OK
Content-type: text/html
Set-Cookie: yummy_cookie=choco
Set-Cookie: tasty_cookie=strawberry
[頁面內容]

現在，對該服務器發起的每一次新請求，瀏覽器都會將之前保存的Cookie信息通過Cookie請求頭部再發送給服務器。

GET /sample_page.html HTTP/1.1
Host: www.example.org
Cookie: yummy_cookie=choco; tasty_cookie=strawberry

客戶端獲取Cookie

客戶端可以通過如下代碼獲取Cookie值.

 document.cookie

代碼實現獲取各個cookie值

var Cookie = {};
var cookie = document.cookie;
var tempArr = cookie.split(";");
var len = tempArr.length;

for(var i = 0; i < len; i++){
    var tempCookie = tempArr[i];
    var p = tempCookie.indexOf("=");
    var key = tempCookie.substring(0,p);
    var value = tempCookie.substring(p+1);
    value = decodeURIComponent(value);
    Cookie[key] = value;
}

獲取結果:

另外除了在控制臺去打印,在chrome的調試器中也可以看到cookie信息.

Cookie 必須在 HTML 文件的內容輸出之前設置；不同的瀏覽器 (Netscape Navigator、Internet Explorer) 對 Cookie 的處理不一致，使用時一定要考慮；客戶端用戶如果設置禁止 Cookie，則 Cookie 不能建立。 并且在客戶端，一個瀏覽器能創建的 Cookie 數量最多為 300 個，并且每個不能超過 4KB，每個 Web 站點能設置的 Cookie 總數不能超過 20 個

設置Cookie

var setCookie = function(key,value,expires){
    var iDay = new Date();
    var maxTime = iDay.setDate(iDay.getDate() + expires);
    document.cookie = key + "=" + value + "; " + "expires=" + maxTime;
};

刪除Cookie值

var deleteCookie = function(key){   
    setCookie(key,"",-1);
}

GPU云服務器云服務器 cookie的使用對于云計算的總結 ie的cookie管理 java中cookie的作用

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/94677.html

關于跨域的總結

摘要：關于跨域，個人總結了以下幾種方法其中等方法常用，的方法既不復雜，也能兼容到幾乎所有瀏覽器，這真是極好的一種跨域方法。這個主要針對跨域訪問的情況兩個網頁一級域名相同，只是二級域名不同，瀏覽器允許通過設置共享。關于跨域，個人總結了以下幾種方法 JSONP CORS WebSocket document.domain window.name location.hash postMessa...

lunaticf 2019-08-22 18:47 評論0 收藏0
關于跨域簡單總結

摘要：開發者需要在中設置屬性為跨域是的簡稱這是一種利用瀏覽器漏洞解決跨域的辦法腳本元素可以不受瀏覽器同源策略的限制。什么是瀏覽器同源策略? 同源是指,域名,協議,端口號均相同,如圖: showImg(https://segmentfault.com/img/bV9rAO?w=1088&h=394); 注意:localhost和127.0.0.1雖然都指向本機,但也是跨域. 瀏覽器同源策略(...

learning 2019-08-22 16:45 評論0 收藏0
關于前端跨域總結

摘要：前端開發中，跨域使我們經常遇到的一個問題，也是面試中經常被問到的一些問題，所以，這里，我們做個總結。同源策略限制了一下行為和無法讀取和對象無法獲取請求發送不出去常見的跨域場景所謂的同源是指，域名協議端口均為相同。前端開發中，跨域使我們經常遇到的一個問題，也是面試中經常被問到的一些問題，所以，這里，我們做個總結。小小問題，不足擔心原文地址：YOU-SHOULD-KNOW-JS 什么是...

muddyway 2019-08-21 18:25 評論0 收藏0
express簡單總結

摘要：介紹如有不詳細或者不正確的地方多多指正。可以通過官方提供的命令行進行安裝，官方目前默認的界面文件用格式，建議修改為格式的文件版權問題，同時要在中安裝對應的包和設置對應的界面引擎解釋器。 express介紹如有不詳細或者不正確的地方多多指正。我們可以拿js與jquery關系來類比一下： jQuery是JS在瀏覽器環境下的封裝庫，把DOM操作，ajax等封裝成了兼容性好，方便使用的方法...

ivyzhang 2019-08-22 13:52 評論0 收藏0