Перевірте, чи доступний localStorage

Я знаю, що було багато запитань щодо перевірки, localStorageале що, якщо хтось вручну вимкне її у своєму браузері? Ось код, який я використовую для перевірки:

localStorage.setItem('mod', 'mod');
if (localStorage.getItem('mod') != null){
  alert ('yes');
  localStorage.removeItem('mod');
} else {
  alert ('no');
}

Проста функція, і вона працює. Але якщо я заходжу в свої налаштування Chrome і вибираю опцію «Не зберігати дані» (я не пам’ятаю, як саме це називається), при спробі запустити цю функцію я не отримую нічого, крім Uncaught Error: SecurityError: DOM Exception 18. То чи є спосіб перевірити, чи у людини це повністю вимкнено?

ОНОВЛЕННЯ: Це друга функція, яку я спробував, і я все ще не отримую відповіді (попередження).

try {
  localStorage.setItem('name', 'Hello World!');
} catch (e) {
  if (e == QUOTA_EXCEEDED_ERR) {
   alert('Quota exceeded!');
  }
}

Використовуйте modernizrпідхід '(можливо, ви хочете змінити ім'я моєї функції на щось краще):

function lsTest(){
    var test = 'test';
    try {
        localStorage.setItem(test, test);
        localStorage.removeItem(test);
        return true;
    } catch(e) {
        return false;
    }
}

if(lsTest() === true){
    // available
}else{
    // unavailable
}

Це не настільки стисло, як інші методи, але це тому, що воно розроблене для максимізації сумісності.

Першоджерело: https://github.com/Modernizr/Modernizr/blob/master/feature-detects/storage/localstorage.js

Робочий приклад: http://jsfiddle.net/6sm54/2/

Я б перевірив, що localStorageвизначено до будь-якої дії, яка від цього залежить:

if (typeof localStorage !== 'undefined') {
    var x = localStorage.getItem('mod');
} else {
    // localStorage not defined
}

ОНОВЛЕННЯ:

Якщо вам потрібно підтвердити, що функція є і вона також не вимкнена, вам доведеться застосувати більш безпечний підхід. Щоб бути в повній безпеці:

if (typeof localStorage !== 'undefined') {
    try {
        localStorage.setItem('feature_test', 'yes');
        if (localStorage.getItem('feature_test') === 'yes') {
            localStorage.removeItem('feature_test');
            // localStorage is enabled
        } else {
            // localStorage is disabled
        }
    } catch(e) {
        // localStorage is disabled
    }
} else {
    // localStorage is not available
}

Місцеве сховище, що виявляє функції, досить складно. Вам потрібно насправді дотягнутися до цього. Причиною цього є те, що Safari вирішив запропонувати функціональний localStorageоб'єкт у приватному режимі, але з квотумом, встановленим на нуль . Це означає, що, хоча всі прості функції виявлення пройдуть, будь-які дзвінки до них localStorage.setItemвикличуть виняток.

Запис мережі розробників Mozilla в API веб-сховища має спеціальний розділ про функції виявлення локального сховища . Ось метод, рекомендований на цій сторінці:

function storageAvailable(type) {
    try {
        var storage = window[type],
            x = '__storage_test__';
        storage.setItem(x, x);
        storage.removeItem(x);
        return true;
    }
    catch(e) {
        return false;
    }
}

І ось як би ви це використали:

if (storageAvailable('localStorage')) {
    // Yippee! We can use localStorage awesomeness
}
else {
    // Too bad, no localStorage for us
}

Якщо ви використовуєте NPM, ви можете скористатися доступним сховищем

npm install -S storage-available

то використовуйте функцію так:

if (require('storage-available')('localStorage')) {
    // Yippee! We can use localStorage awesomeness
}

Застереження : Я як автор розділу документації щодо MDN та пакета NPM.

MDN оновив функцію виявлення пам’яті. У 2018 році це надійніше:

function storageAvailable() {
    try {
        var storage = window['localStorage'],
            x = '__storage_test__';
        storage.setItem(x, x);
        storage.removeItem(x);
        return true;
    }
    catch(e) {
        return e instanceof DOMException && (
            // everything except Firefox
            e.code === 22 ||
            // Firefox
            e.code === 1014 ||
            // test name field too, because code might not be present
            // everything except Firefox
            e.name === 'QuotaExceededError' ||
            // Firefox
            e.name === 'NS_ERROR_DOM_QUOTA_REACHED') &&
            // acknowledge QuotaExceededError only if there's something already stored
            storage && storage.length !== 0;
    }
}

Браузери, які підтримують localStorage, матимуть властивість для віконного об’єкта з ім’ям localStorage. Однак з різних причин лише твердження про наявність власності може спричинити винятки. Якщо він існує, це все ще не гарантує, що localStorage насправді доступний, оскільки різні браузери пропонують налаштування, які вимикають localStorage. Отже, браузер може підтримувати localStorage, але не робити його доступним для сценаріїв на сторінці. Одним із прикладів цього є Safari, який в режимі приватного перегляду дає нам порожній об’єкт localStorage з квотою нуля, фактично роблячи його непридатним для використання. Однак ми все одно можемо отримати законну QuotaExceededError, що означає лише те, що ми використали весь доступний простір для зберігання, але сховище фактично доступне. Наша функція виявлення особливостей повинна враховувати ці сценарії.

Дивіться тут коротку історію виявлення функцій localStorage .

За допомогою цієї функції ви можете перевірити, чи доступне місцеве зберігання чи ні, і ви тримаєте під контролем можливі винятки.

function isLocalStorageAvailable() {

    try {
        var valueToStore = 'test';
        var mykey = 'key';
        localStorage.setItem(mykey, valueToStore);
        var recoveredValue = localStorage.getItem(mykey);
        localStorage.removeItem(mykey);

        return recoveredValue === valueToStore;
    } catch(e) {
        return false;
    }
}

Модифікація відповіді Джо для додавання геттера полегшує використання. Нижче ви просто говорите:if(ls)...

Object.defineProperty(this, "ls", {
  get: function () { 
    var test = 'test';
    try {
      localStorage.setItem(test, test);
      localStorage.removeItem(test);
      return true;
    } catch(e) {
      return false;
    }
  }
});

Ось проста перевірка:

if(typeof localStorage === 'undefined'){

Використовуйте це, щоб перевірити, чи встановлено localStorage. Це допоможе вам отримати статус Localstorage.

    if( window.localStorage.fullName !== undefined){

           //action
   }else{
          }