Проверьте, доступен ли 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. Итак, есть ли способ проверить, полностью ли он отключен?

UPDATE: Это вторая функция, которую я пробовал, и я все еще не получаю ответа (предупреждение).

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

Ответ 1

Используйте 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/

Ответ 2

Я бы проверял, что localStorage определяется до любого действия, которое зависит от него:

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

UPDATE:

Если вам необходимо проверить, что функция существует, и что она также не отключена, вам необходимо использовать более безопасный подход. Чтобы быть абсолютно безопасным:

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
}

Ответ 3

Обнаружение особенностей локального хранилища сложно. Вы должны на самом деле достичь этого. Причина этого заключается в том, что Safari решил предложить функциональный объект localStorage когда он находится в частном режиме, но с его квотом, установленным на ноль. Это означает, что, хотя все простые функции обнаружения будут проходить, любые вызовы localStorage.setItem будут localStorage.setItem исключение.

Запись Mozilla Developer Network в 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.

Ответ 4

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 something already stored
            storage && storage.length !== 0;
    }
}

Браузеры, поддерживающие localStorage, будут иметь свойство объекта окна с именем localStorage. Однако по разным причинам утверждение о том, что свойство существует, может вызывать исключения. Если он существует, это еще не гарантия того, что localStorage действительно доступен, поскольку различные браузеры предлагают настройки, которые отключают localStorage. Таким образом, браузер может поддерживать localStorage, но не делать его доступным для скриптов на странице. Одним из примеров этого является Safari, который в режиме частного просмотра дает нам пустой объект localStorage с нулевой квотой, что делает его непригодным для использования. Тем не менее, мы все равно можем получить допустимую ошибку QuotaExceededError, что означает только то, что мы израсходовали все доступное пространство для хранения, но хранилище действительно доступно. Наша функция обнаружения должна учитывать эти сценарии.

Смотрите здесь краткую историю обнаружения функций localStorage.

Ответ 5

С помощью этой функции вы можете проверить, доступен ли 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;
    }
}

Ответ 6

Изменение ответа Джо на добавление геттера упрощает его использование. С ниже вы просто говорите: 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;
    }
  }
});

Ответ 7

Вот простая проверка:

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

Ответ 8

Использовать это, чтобы установить localStorage или нет. Это поможет вам получить статус Localstorage.

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

           //action
   }else{
          }