Як визначити, чи підтримує браузер локальну пам’ять HTML5

Наступні попередження коду ls existв IE7:

if(window.localStorage) {
    alert('ls exists');
} else {
    alert('ls does not exist');
}

IE7 насправді не підтримує локальне сховище, але це все одно попереджає. Можливо, це тому, що я використовую IE9 у браузері IE7 та режимах документування за допомогою інструмента розробника IE9. Або, можливо, це просто неправильний спосіб перевірити, чи підтримується LS. Який правильний шлях?

Крім того, я не хочу використовувати Modernizr, оскільки я використовую лише кілька функцій HTML5, а завантаження великого сценарію не варто того, щоб просто виявити підтримку цих кількох речей.

Вам не потрібно використовувати modernizr, але ви можете використовувати їх метод, щоб визначити, чи localStorageпідтримується

модернізатор в тесті github
дляlocalStorage

// In FF4, if disabled, window.localStorage should === null.

// Normally, we could not test that directly and need to do a
//   `('localStorage' in window) && ` test first because otherwise Firefox will
//   throw bugzil.la/365772 if cookies are disabled

// Also in iOS5 & Safari Private Browsing mode, attempting to use localStorage.setItem
// will throw the exception:
//   QUOTA_EXCEEDED_ERRROR DOM Exception 22.
// Peculiarly, getItem and removeItem calls do not throw.

// Because we are forced to try/catch this, we'll go aggressive.

// Just FWIW: IE8 Compat mode supports these features completely:
//   www.quirksmode.org/dom/html5.html
// But IE8 doesn't support either with local files

Modernizr.addTest('localstorage', function() {
    var mod = 'modernizr';
    try {
        localStorage.setItem(mod, mod);
        localStorage.removeItem(mod);
        return true;
    } catch(e) {
        return false;
    }
});

оновлено поточним вихідним кодом

if(typeof Storage !== "undefined")
  {
  // Yes! localStorage and sessionStorage support!
  // Some code.....
  }
else
  {
  // Sorry! No web storage support..
  }

Ця функція чудово працює:

function supports_html5_storage(){
    try {
        return 'localStorage' in window && window['localStorage'] !== null;
    } catch(e) {
        return false;
    }
}

Джерело: www.diveintohtml5.info

Крім того, я не хочу використовувати Modernizr, оскільки я використовую лише кілька функцій HTML5, а завантаження великого сценарію не варто того, щоб просто виявити підтримку цих кількох речей.

Щоб зменшити розмір файлу Modernizr, налаштуйте файл за адресою http://modernizr.com/download/ відповідно до ваших потреб. Локальна версія Modernizr, доступна лише для зберігання, об’ємом 1,55 КБ.

Спробуйте window.localStorage!==undefined:

if(window.localStorage!==undefined){
    //Do something
}else{
    alert('Your browser is outdated!');
}

Ви також можете використовувати typeof window.localStorage!=="undefined", але наведене вище твердження це вже робить

Я не бачив цього у відповідях, але я думаю, що добре знати, що ви можете легко використовувати vanilla JS або jQuery для таких простих тестів, і хоча Modernizr дуже допомагає, є чисті рішення без нього.

Якщо ви використовуєте jQuery , ви можете зробити:

var _supportsLocalStorage = !!window.localStorage
    && $.isFunction(localStorage.getItem)
    && $.isFunction(localStorage.setItem)
    && $.isFunction(localStorage.removeItem);

Або за допомогою чистого ванільного JavaScript :

var _supportsLocalStorage = !!window.localStorage
    && typeof localStorage.getItem === 'function'
    && typeof localStorage.setItem === 'function'
    && typeof localStorage.removeItem === 'function';

Тоді ви просто зробите ІФ, щоб перевірити підтримку:

if (_supportsLocalStorage) {
    console.log('ls is supported');
    alert('ls is supported');
}

Тож вся ідея полягає в тому, що всякий раз, коли вам потрібні функції JavaScript, ви спочатку тестуєте батьківський об’єкт, а потім методи, які використовує ваш код.

Спробуйте зловити зробить роботу:

    try{
       localStorage.setItem("name",name.value);
       localStorage.setItem("post",post.value);
       }
    catch(e){
       alert(e.message);    
       }

Спробуйте:

if(typeof window.localStorage != 'undefined') {
}

if (window.localStorage){

   alert('localStorage is supported');
   window.localStorage.setItem("whatever", "string value");

}

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

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

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

function script(){
  if(ls){
    alert('Yes');
  } else {
    alert('No');
  }
}

<button onclick="script()">Local Storage Support?</button>

Я знаю, що трохи запізнився на вечірку, але у мене є кілька корисних функцій, які я приготував і кинув у файл з назвою 'manage_storage.js'. Я сподіваюся, вони так само корисні вам, хлопці, як і добре мені послужили.

Пам'ятайте: функцією, яку ви шукаєте (відповідає на це питання), є isLclStorageAllowed.

Отже, без зайвих сумнівів ось мій код:

/* Conditional Function checks a web browser for 'session storage' support. [BEGIN] */

if (typeof isSessStorageAllowed !== 'function')
    {
        function isSessStorageAllowed()
            {
                if (!!window.sessionStorage && typeof sessionStorage.getItem === 'function' && typeof sessionStorage.setItem === 'function' && typeof sessionStorage.removeItem === 'function')
                    {
                        try
                            {
                                var cur_dt = new Date();
                                var cur_tm = cur_dt.getTime();
                                var ss_test_itm_key = 'ss_test_itm_' + String(cur_tm);
                                var ss_test_val = 'ss_test_val_' + String(cur_tm);

                                sessionStorage.setItem(ss_test_itm_key, String(ss_test_val));

                                if (sessionStorage.getItem(ss_test_itm_key) == String(ss_test_val))
                                    {
                                        return true;
                                    }
                                else
                                    {
                                        return false;
                                    };

                                sessionStorage.removeItem(ss_test_itm_key);
                            }
                        catch (exception)
                            {
                                return false;
                            };
                    }
                else
                    {
                        return false;
                    };
            };
    };

/* Conditional Function checks a web browser for 'session storage' support. [END] */

/* Conditional Function checks a web browser for 'local storage' support. [BEGIN] */

if (typeof isLclStorageAllowed !== 'function')
    {
        function isLclStorageAllowed()
            {
                if (!!window.localStorage && typeof localStorage.getItem === 'function' && typeof localStorage.setItem === 'function' && typeof localStorage.removeItem === 'function')
                    {
                        try
                            {
                                var cur_dt = new Date();
                                var cur_tm = cur_dt.getTime();
                                var ls_test_itm_key = 'ls_test_itm_' + String(cur_tm);
                                var ls_test_val = 'ls_test_val_' + String(cur_tm);

                                localStorage.setItem(ls_test_itm_key, String(ls_test_val));

                                if (localStorage.getItem(ls_test_itm_key) == String(ls_test_val))
                                    {
                                        return true;
                                    }
                                else
                                    {
                                        return false;
                                    };

                                localStorage.removeItem(ls_test_itm_key);
                            }
                        catch (exception)
                            {
                                return false;
                            };
                    }
                else
                    {
                        return false;
                    };
            };
    };

/* Conditional Function checks a web browser for 'local storage' support. [END] */

/* Conditional Function checks a web browser for 'web storage' support. [BEGIN] */

/* Prerequisites: 'isSessStorageAllowed()', 'isLclStorageAllowed()' */

if (typeof isWebStorageAllowed !== 'function')
    {
        function isWebStorageAllowed()
            {
                if (isSessStorageAllowed() === true && isLclStorageAllowed() === true)
                    {
                        return true;
                    }
                else
                    {
                        return false;
                    };
            };
    };

/* Conditional Function checks a web browser for 'web storage' support. [END] */