Как определить, поддерживает ли браузер HTML5 Local Storage
Следующий код предупреждает ls exist
в IE7:
if(window.localStorage) {
alert('ls exists');
} else {
alert('ls does not exist');
}
IE7 действительно не поддерживает локальное хранилище, но это все еще предупреждает об этом. Возможно, это связано с тем, что я использую IE9 в браузерах IE7 и режимах документа, используя инструмент разработчика IE9. Или, возможно, это неправильный способ проверить, поддерживается ли LS. Каков правильный путь?
Также я не хочу использовать Modernizr, так как я использую только несколько функций HTML5, а загрузка большого script не стоит просто обнаружить поддержку этих нескольких вещей.
Ответы
Ответ 1
Вам не нужно использовать 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;
}
});
обновлен с использованием текущего исходного кода
Ответ 2
if(typeof Storage !== "undefined")
{
// Yes! localStorage and sessionStorage support!
// Some code.....
}
else
{
// Sorry! No web storage support..
}
Ответ 3
Также я не хочу использовать Modernizr, так как я использую только несколько HTML5 функции и загрузка большого script не стоит просто обнаружить поддержка этих немногих вещей.
Чтобы уменьшить размер файла Modernizr, настройте файл http://modernizr.com/download/ в соответствии с вашими потребностями. Локальная версия Modernizr для локального хранилища поставляется в 1,55 КБ.
Ответ 4
Эта функция работает нормально:
function supports_html5_storage(){
try {
return 'localStorage' in window && window['localStorage'] !== null;
} catch(e) {
return false;
}
}
Источник: www.diveintohtml5.info
Ответ 5
Попробуйте window.localStorage!==undefined
:
if(window.localStorage!==undefined){
//Do something
}else{
alert('Your browser is outdated!');
}
Вы также можете использовать typeof window.localStorage!=="undefined"
, но вышеприведенное утверждение делает это
Ответ 6
Я не видел этого в ответах, но я думаю, что хорошо знать, что вы можете легко использовать 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 для проверки поддержки:
if (_supportsLocalStorage) {
console.log('ls is supported');
alert('ls is supported');
}
Итак, вся идея заключается в том, что всякий раз, когда вам нужны функции JavaScript, вы должны сначала протестировать родительский объект, а затем методы, которые использует ваш код.
Ответ 7
Попробуйте поймать работу:
try{
localStorage.setItem("name",name.value);
localStorage.setItem("post",post.value);
}
catch(e){
alert(e.message);
}
Ответ 8
Попробуйте:
if(typeof window.localStorage != 'undefined') {
}
Ответ 9
if (window.localStorage){
alert('localStorage is supported');
window.localStorage.setItem("whatever", "string value");
}
Ответ 10
Изменение ответа Андреа для добавления геттера облегчает его использование. С ниже вы просто говорите: 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>