主要為了考察對于前端內容存儲的一些問題,三者的明顯區別,三者應該用在什么地方,什么情況應該用那種,可從這些方面進行回答;
(sessionStorage 、localStorage 和 cookie 之間的區別
共同點:都是保存在瀏覽器端,且同源的。
區別:cookie數據始終在同源的http請求中攜帶(即使不需要),即cookie在瀏覽器和服務器間來回傳遞。
而sessionStorage和localStorage不會自動把數據發給服務器,僅在本地保存。cookie數據還有路徑(path)的概念,可以限制cookie只屬于某個路徑下。
存儲大小限制也不同,
cookie數據不能超過4k,同時因為每次http請求都會攜帶cookie,所以cookie只適合保存很小的數據,如會話標識。
sessionStorage和localStorage 雖然也有存儲大小的限制,但比cookie大得多,可以達到5M或更大。
cookie只在設置的cookie過期時間之前一直有效,即使窗口或瀏覽器關閉。
作用域不同,sessionStorage不在不同的瀏覽器窗口中共享,即使是同一個頁面;
localStorage 在所有同源窗口中都是共享的;
cookie也是在所有同源窗口中都是共享的。
使用HTML5 Web存儲的localStorage和sessionStorage方式進行Web頁面數據本地存儲。
頁面參考如下圖,能將頁面上的數據進行本地存儲。并能讀取存儲的數據顯示在頁面上。
localStorage(本地存儲),可以長期存儲數據,沒有時間限制,一天,一年,兩年甚至更長,數據都可以使用。
sessionStorage(會話存儲),只有在瀏覽器被關閉之前使用,創建另一個頁面時同意可以使用,關閉瀏覽器之后數據就會消失。)