1. ホーム
  2. javascript

[解決済み] ブラウザがHTML5ローカルストレージをサポートしているかどうかを検出する方法

2023-05-02 15:50:38

質問

次のコードで警告を表示します。 ls exist をIE7で表示します。

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

IE7はローカルストレージに対応していないのですが、これでも対応していると警告しています。おそらくこれは、IE9 の開発者ツールを使用して、IE7 のブラウザ モードとドキュメント モードで IE9 を使用しているためでしょう。あるいは、これは LS がサポートされているかどうかをテストするための間違った方法かもしれません。正しい方法は何ですか?

また、私はいくつかの HTML5 機能しか使用しておらず、それらのいくつかのもののサポートを検出するためだけに大きなスクリプトをロードする価値がないので、Modernizr を使用したくありません。

どのように解決するのですか?

modernizrを使う必要はありませんが、modernizrのメソッドで localStorage がサポートされているかどうかを検出するために使用できます。

githubのmodernizr

のテスト 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;
    }
});

現在のソースコードで更新