移動端瀏覽器隱私模式/無痕模式使用本地存儲localStorage/sessionStorage的問題

移動端瀏覽器隱私模式/無痕模式使用本地存儲localStorage/sessionStorage的問題

開發H5 webapp時常常須要使用本地存儲，如localStorage和sessionStorage存儲一些數據，相比最多能存4k的cookie相比，用起來很好用。可是localStorage在iOS Safari、chrome和UC瀏覽器中的隱私模式（也叫無痕模式）下沒法使用，手機Safari瀏覽器中具體表現是：

• localStorage對象仍然存在
• 可是setItem會報異常：QuotaExceededError
• getItem和removeItem直接忽略

Safari中控制檯截圖

判斷瀏覽器是否支持localStorage的方法:

function isLocalStorageSupported() {
    var testKey = 'test',
        storage = window.sessionStorage;
    try {
        storage.setItem(testKey, 'testValue');
        storage.removeItem(testKey);
        return true;
    } catch (error) {
        return false;
    }
}