sessionStorage & localStorage & cookie

概念

• html5中的Web Storage包括了兩種存儲方式：sessionStorage和localStorage。
• sessionStorage用于本地存儲一個會話（session）中的數據，這些數據只有在同一個會話中的頁面才能訪問并且當會話結束后數據也隨之銷毀
• localStorage用于持久化的本地存儲，除非主動刪除數據，否則數據是永遠不會過期的。
• Cookie指某些網站為了辨別用戶身份、進行session跟蹤而儲存在用戶本地終端上的數據（通常經過加密）。

用途

• sessionStorage
• localStorage
• Cookie: 服務器可以利用Cookies包含信息的任意性來篩選并經常性維護這些信息，以判斷在HTTP傳輸中的狀態。Cookies最典型的應用是判定注冊用戶是否已經登錄網站，用戶可能會得到提示，是否在下一次進入此網站時保留用戶信息以便簡化登錄手續，這些都是Cookies的功用。另一個重要應用場合是“購物車”之類處理。用戶可能會在一段時間內在同一家網站的不同頁面中選擇不同的商品，這些信息都會寫入Cookies，以便在最后付款時提取信息。

特點

• 內存大小 :
  • 單個cookie保存的數據不能超過4K，很多瀏覽器都限制一個站點最多保存20個cookie。
  • localStorage中一般瀏覽器支持的是5M大小，這個在不同的瀏覽器中localStorage會有所不同。
• 存儲位置 : cookie是在客戶端保存的方案.而session是在服務端保存的方案.
• 生命周期 :
  • localStorage生命周期是永久，這意味著除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，否則這些信息將永遠存在
  • sessionStorage生命周期為當前窗口或標簽頁，一旦窗口或標簽頁被永久關閉了，那么所有通過sessionStorage存儲的數據也就被清空了。
  • cookie是在客戶端保存的方案.而session是在服務端保存的方案.如果cookie不設定時間的話就表視它的生命周期為瀏覽器會話的期間,只要關閉IE,cookie就消失了這種cookie被稱為會話cookie.其一般不保存在硬盤上.而是保存在內存中.如果設置了過期時間.那么瀏覽器會把cookie保存到硬盤中,再次打IE時會依然有效.直到它的有效期超時;注:存儲在硬盤中的cookie可以在不同IE間共享;
• 不同瀏覽器無法共享localStorage或sessionStorage中的信息。相同瀏覽器的不同頁面間可以共享相同的localStorage（頁面屬于相同域名和端口），但是不同頁面或標簽頁間無法共享sessionStorage的信息。這里需要注意的是，頁面及標簽頁僅指頂級窗口，如果一個標簽頁包含多個iframe標簽且他們屬于同源頁面，那么他們之間是可以共享sessionStorage的。
• 他們均只能存儲字符串類型的對象

操作

localStorage和sessionStorage都具有相同的操作方法，例如setItem、getItem和removeItem等

存儲 setItem

用途：將value存儲到key字段

用法：.setItem( key, value)

sessionStorage.setItem("key", "value"); localStorage.setItem("site", "js8.in");

獲取 getItem

用途：獲取指定key本地存儲的值

用法：.getItem(key)

var value = sessionStorage.getItem("key"); var site = localStorage.getItem("site");

刪除 removeItem

用途：刪除指定key本地存儲的值

用法：.removeItem(key)

sessionStorage.removeItem("key"); localStorage.removeItem("site");

清空 clear

用途：清除所有的key/value

用法：.clear()

sessionStorage.clear(); localStorage.clear();

轉載于:https://www.cnblogs.com/sweetBug/p/5847781.html

總結

以上是生活随笔為你收集整理的sessionStorage localStorage cookie的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。