1. 程式人生 > >瀏覽器儲存之Cookie、LocalStorage 和 SessionStorage的區別詳解

瀏覽器儲存之Cookie、LocalStorage 和 SessionStorage的區別詳解

Cookie

常用於客戶端與服務端之間的通訊,但是它有本地儲存的功能。

缺點:

儲存量太小,只有4kb

所有http請求都會含cookie,會影響獲取資源的效率

API簡單,需要封裝一下才能用

LocalStorage 和SessionStorage

H5問世後,專為瀏覽器儲存而設計,最大容量為5mb

API簡單易用,localStorage.setItem(key,value)和localStorage.getItem(key,value),sessionStorage也是如此

但是這兩個儲存的區別在哪裡呢?

1. localStorage儲存時間取決於使用者設定的有效期,如果瀏覽器關閉,localstorage儲存的東西不會消失。

2. sessionStorage會在瀏覽器關閉時,所儲存的東西會被銷燬。

Cookie LocalStorage SessionStorage
容量 4KB 5MB 5MB
是否包含在ajax中
API易用性 需要封裝

三者使用場景:

cookie一般儲存使用者名稱密碼相關資訊,或者過期日期。

localStorage可以用來統計頁面訪問次數。

sessionStorage可以用來統計當前頁面元素的點選次數。