Question

我知道有很多关于检查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!');
}
}

Answer 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/

Answer 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
}

Answer 3

检测本地存储的功能很棘手。你需要实际进入它。这样做的原因是Safari选择在私人模式下提供功能localStorage对象，但将其设置为零。这意味着虽然所有简单的功能检测都会通过，但对localStorage.setItem的任何调用都会抛出异常。

Web Storage API上的Mozilla开发者网络条目有dedicated section on feature detecting local storage。以下是该页面推荐的方法：

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，则可以使用

抓取storage-available

npm install -S storage-available

然后像这样使用函数：

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

免责声明：MDN的文档部分和NPM包都是由我撰写的。

Answer 4

MDN updated存储检测功能。在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，这仅意味着我们已经用完了所有可用的存储空间，但是存储实际上是可用的。我们的功能检测应该考虑这些情况。

在这里查看brief history of feature-detecting localStorage。

Answer 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;
    }
}

Answer 6

最好结合 localStorage 检查 cookies 的可用性，因为如果启用 cookie，浏览器可以检测到 localStorage 可用并且 {{1} } 它作为 type，但不提供使用它的可能性。您使用下一个函数来检测 object 和 localStorage：

cookies

Answer 7

修改Joe的答案以添加getter使其更易于使用。如下所示，您只需说：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;
    }
  }
});

Answer 8

这是一个简单的检查：

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

Answer 9

使用此选项检查是否设置了localStorage。它可以帮助您获取Localstorage的状态。

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

           //action
   }else{
          }

检查localStorage是否可用

9 个答案: