cookie session webStorage 區別總結筆記

cookie

什么是 cookie

cookie是指某些網站為了辨別用戶身份而存儲在用戶本地終端(client side)上的數據(通常經過加密)。cookie通過HTTP請求報文和響應報文配合完成。
cookie是存儲于訪問者的計算機中的變量。每當同一臺計算機通過瀏覽器請求同一個頁面時,就會發送這個 cookie 。
通俗的說就是當一個用戶通過HTTP協議訪問一個服務器的時候,這個服務器會將一些key/Value鍵值對返回給客戶端瀏覽器,并給這些數據加上一些限制條件,在條件符合時這個用戶下次訪問這個服務器的時候,數據又被完整的帶回給服務器。
cookie是瀏覽器提供的一種機制,可以由 javascript 對其進行控制,而不是 javascript 本身的性質。

HTTP 無狀態

HTTP協議是無狀態的協議。一旦數據交換完畢,客戶端與服務器的連接就會關閉,再次交換數據需要建立新的連接。這就意味著服務器無法從連接上跟蹤會話。
而cookie機制采用的是在客戶端保持狀態的方案,而session機制采用的是在服務器端保持狀態的方案。

cookie 的不可跨域名性

cookie是存于用戶硬盤的一個文件,這個文件通常對應于一個域名。cookie可以跨越同一個域名下的多個網頁,但不能跨越多個域名使用。

cookie 的使用場景

  1. 購物車
    沒有登錄之前商品數據是保存在cookie中
  2. 記住用戶名
    利用cookie保存用戶名
  3. 記住窩
    利用cookie來保存用戶名和密碼(加密后保存的)

cookie 的缺點

  1. cookie體積過大會造成請求和響應速度變慢。
  2. 默認瀏覽器會任何請求都把cookie帶上去,哪怕是靜態資源。
  3. cookie可以在前后端修改,數據容易篡改或偽造。
  4. cookie對于敏感數據的保護基本是無效的。
  5. 有些用戶是禁用掉cookie的

session

除了cookie,web應用程序中還經常使用session來記錄客戶端的登錄狀態。不同于cookie,session保存在服務器上。session相當于程序在服務器上建立一份客戶檔案,客戶來訪時只需要查詢客戶檔案表就可以了。

webStorage

webStorage是HTML5中本地存儲的解決方案之一,在 html5 中的 WebStorage 概念引入并不是為取代 cookie 而制定的標準,cookie 作為HTTP協議的一部分用來處理客戶端和服務器通信是不可或缺的, session正是依賴于實現的客戶端狀態保持。
webStorage的意圖在于解決本地本來不應該用 cookie 做,卻不得不用cookie的本地存儲。

webStorage 的優勢

  1. 從容量上講WebStorage一般瀏覽器提供5M的存儲空間。
  2. 安全性上WebStorage 并不作為 HTTP header 發送的瀏覽器,所以相對安全。
  3. 從流量上講,因為WebStorage不傳送到服務器,所以不必要的流量可以節省。

Html 5的Web Storage分兩種,一個是sessionStorage,另一個是localStorage,兩者差別就差在生命周期的不同而已。
sessionStorage 用于本地存儲一個會話(session)中的數據,這些數據只有在同一個會話中的頁面才能訪問并且當會話結束后數據也隨之銷毀。因此 sessionStorage 不是一種長久化的本地存儲,僅僅是會話級別的存儲。
而localStorage則正好相反,除非主動刪除數據,否則數據是永遠不會過期的。

cookie和session的區別

  1. session 保存在服務器,客戶端不知道其中的信息;cookie 保存在客戶端,服務器能夠知道其中的信息。
  2. session 中保存的是對象,cookie 中保存的是字符串。
  3. session 不能區分路徑,同一個用戶在訪問一個網站期間,所有的session在任何地方都可以訪問到。而 cookie 中如果設置了路徑參數,那么同一個網站不同路徑下的 cookie 互相是不可以訪問的。
  4. cookie 不是很安全,本人可以分析存放在本地的 COOKIE 并進行 COOKIE欺騙
  5. session 會在一定時間內保存在服務器上。當訪問增多,會占用你服務器的性能。考慮到減輕服務器性能方面,應該使用 COOKIE。
  6. 單個 cookie 保存的數據不能超過 4k ,很多瀏覽器都限制一個站點最多保存 20 個 cookie。
  7. session 是通過 cookie來工作的。

cookie 和 sessionStorage 、localStorage之間的區別

  1. 共同點:都是保存在瀏覽器端,且同源的。
  2. 區別:
    • cookie數據始終在同源的http請求中攜帶(即使不需要),即cookie在瀏覽器和服務器間來回傳遞。而sessionStorage和localStorage不會自動把數據發給服務器,僅在本地保存。
    • cookie數據還有路徑(path)的概念,可以限制cookie只屬于某個路徑下。
    • 存儲大小限制也不同,cookie數據不能超過4k,同時因為每次http請求都會攜帶cookie,所以cookie只適合保存很小的數據,如會話標識。sessionStorage和localStorage 雖然也有存儲大小的限制,但比cookie大得多,可以達到5M或更大。
    • 數據有效期不同,
      sessionStorage:僅在當前瀏覽器窗口關閉前有效,自然也就不可能持久保持;
      localStorage:始終有效,窗口或瀏覽器關閉也一直保存,因此用作持久數據;
      cookie只在設置的cookie過期時間之前一直有效,即使窗口或瀏覽器關閉。
    • 作用域不同,
      sessionStorage不在不同的瀏覽器窗口中共享,即使是同一個頁面;
      localStorage 在所有同源窗口中都是共享的;
      cookie也是在所有同源窗口中都是共享的。
    • Web Storage 支持事件通知機制,可以將數據更新的通知發送給監聽者。
    • Web Storage 的 api 接口使用更方便。

sessionStorage與頁面 js 數據對象的區別

頁面中一般的 js 對象或數據的生存期是僅在當前頁面有效,因此刷新頁面或轉到另一頁面這樣的重新加載頁面的情況,數據就不存在了。
而 sessionStorage 只要同源的同窗口(或tab)中,刷新頁面或進入同源的不同頁面,數據始終存在。也就是說只要這個瀏覽器窗口沒有關閉,加載新頁面或重新加載,數據仍然存在。

參考自:

請描述一下 cookies,sessionStorage 和 localStorage 的區別?

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容