本地儲存（一）—— Cookie、SessionStorage和LocalStorage詳解
目錄
3. Cookie、SessionStorage和LocalStorage的對比
Cookie、SessionStorage和LocalStorage：瀏覽器的快取機制提供的可以將使用者資料儲存在客戶端上的方式，常用於儲存 web 頁面的使用者資訊等資料。
1. Cookie
最早的時候 Cookie 的出現是為了解決 HTTP 的狀態管理問題。
由於 HTTP 是無狀態協議
為了解決這個問題，就引入了Cookie。
* 需要注意的是，
（1） 同一個域名下的所有請求，都會攜帶 Cookie。這就造成了一個問題，如果我們儲存了過多的Cookie會帶來巨大的效能浪費。隨著請求的疊加，一些不必要的 Cookie 帶來的開銷將是無法想象的。
（2）Cookie 的儲存大小最大隻能有 4KB。當 Cookie 超過 4KB 時，將會被裁切，只能用來存取少量的資訊。
2. Web Storage
Web Storage 是 HTML5 專為瀏覽器儲存而提供的資料儲存機制。它又分為 Local Storage 與 Session Storage，允許在瀏覽器中儲存 key/value 對的資料（儲存資料大小一般都是5MB）。
2.1 Session Storage
sessionStorage 用於臨時儲存同一視窗(或標籤頁)的資料，在關閉視窗或標籤頁之後將會刪除這些資料。
（1）儲存資料大小為 5MB；
（2）只能儲存字串型別的物件（若要儲存物件，需要轉換為JSON字串）；
（3）sessionStorage 僅在當前會話下有效，不同頁面或標籤頁間無法共享sessionStorage的資訊
需要注意的是： sessionStorage引入了一個“瀏覽器視窗”的概念，sessionStorage是在同源的視窗中始終存在的資料。只要這個瀏覽器視窗沒有關閉，即使重新整理頁面或者進入同源另一個頁面，資料依然存在；關閉了瀏覽器視窗後就會被銷燬。上述頁面及標籤頁僅指頂級視窗，如果一個標籤頁包含多個iframe標籤且他們屬於同源頁面，那麼他們之間是可以共享sessionStorage的。
2.2 Local Storage
LocalStorage 用於長久儲存整個網站的資料，儲存的資料沒有過期時間，直到手動去刪除。
（1）LocalStorage 可以將第一次請求的資料直接儲存到本地，這個相當於一個 5M 大小的針對於前端頁面的資料庫，相比於 cookie 可以節約頻寬。
（2）只能儲存字串型別的物件（若要儲存物件，需要轉換為JSON字串）；
（3）localStorage在瀏覽器的隱私模式下面是不可讀取的。
（4）相同瀏覽器的不同頁面間可以共享相同的 localStorage（同源頁面），不同的網站直接是不能共用相同的 localStorage；
（5）localStorage生命週期是永久性的，沒有過期時間，直到手動去刪除。
2.3 Web Storage 的瀏覽器支援情況
3. Cookie、SessionStorage和LocalStorage的對比
