1. 程式人生 > >html5的web存儲與cookie的區別

html5的web存儲與cookie的區別

try-catch 本地 一個 script div 用戶 比較 document 限制

以下從3個方面進行比較: 1,容量:cookie只有4KB,localStorage和sessionStorage最大容量5M 2,是否會攜帶到ajax中:cookie由每個對服務器的請求來傳遞,會影響獲取資源的效率,localStorage和sessionStorage只有在請求時使用數據。它使在不影響網站性能的情況下存儲大量數據成為可能。 3,API易用性:cookie需要封裝才能使用,localStorage和sessionStorage簡單易用

HTML5 專門為存儲而設計提供了兩種在客戶端存儲數據的新方法:localStorage和sessionStorage

  • localStorage - 沒有時間限制的數據存儲,第二天、第二周或下一年之後,數據依然可用。
  • sessionStorage - 針對一個 session 的數據存儲,當用戶關閉瀏覽器窗口後,數據會被刪除。
最大容量5M,數據不是由每個服務器請求傳遞的,而是只有在請求時使用數據。它使在不影響網站性能的情況下存儲大量數據成為可能。

對於不同的網站,數據存儲於不同的區域,並且一個網站只能訪問其自身的數據。

HTML5 使用 JavaScript 來存儲和訪問數據。

API簡單易用 localStorage.setItem(key,value) localStorage.getItem(key) 註意: ios safari隱藏模式(隱私模式)下 localStorage和sessionStroage會報錯 建議統一使用try-catch封裝 cookie 本身用於客戶端和服務端通信但它有本地存儲的功能,於是被“借用” cookie用於存儲的缺點 存儲量太小,只有4KB 所有http請求都帶著,會影響獲取資源的效率 API需要封裝才能用document.cookie = ... 具體可參考其他鏈接:https://www.cnblogs.com/kaixin3946/p/6042014.html

html5的web存儲與cookie的區別