sessionStorage和localStorage的使用

前言

最近在項目中遇到了兩個需求，並且都用到了H5的這兩種儲存方式

1 sessionStorage

需求：我從後臺得到一個URL的時候，我根據路由判斷用戶一進入頁面顯示出一個蒙層，當用戶進入當前頁面的其他頁面再返回時需要使蒙層消失，這時候我就使用到了sessionStorage以及它的特性 瀏覽器關閉時自動銷毀，成功解決；

2 localStorage

需求：頁面有一個客服入口，每次進入客服時都要請求一次用戶信息傳給客服，這時候用到了localStorage，用戶第一次進入客服時將用戶信息保存在瀏覽器中，這樣用戶每次進入客服時後臺都會直接獲取到用戶信息

區別

sessionStorage 瀏覽器關閉時自動銷毀

localStorage 存儲在瀏覽器中，無期限

sessionStorage用法

// 保存或設置數據到sessionStorage
    sessionStorage.setItem('key','value')
    
// 獲取某個sessionStorage
    sessionStorage.getItem('key')
    
// 從sessionStorage刪除某個保存的數據
    sessionStorage.removeItem('key')
    
// 從sessionStorage刪除所有保存的數據
    sessionStorage.clear();

localStorage用法

// 保存或設置數據到localStorage
    localStorage.setItem('key','value')
    
// 獲取某個localStorage
    localStorage.getItem('key')
    
// 從localStorage刪除某個保存的數據
    localStorage.removeItem('key')
    
// 從localStorage刪除所有保存的數據
    localStorage.clear();