[解決済み] localStorageの使用量計算

質問

BespinエディタとHTML5のlocalStorageを使用してアプリを作成しています。これはすべてのファイルをローカルに保存し、文法を助け、JSLint および CSS と HTML のための他のいくつかのパーサーを使用して、ユーザーを支援します。

私は、localStorageの上限がどれくらい使用されたか、そして実際にどれくらいあるか計算したいです。 これは今日可能ですか？ 単純に保存されているビットを計算するのはやめようと思っていました。しかし、また、私は自分自身で測定することができないより多くのものがあるかどうかわかりません。

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

私が必要とするブラウザで残りの制限を取得する普遍的な方法は見つかりませんでしたが、制限に達したときにポップアップするエラー メッセージがあることを知りました。もちろん、これは各ブラウザで異なります。

それを最大化するために、私はこの小さなスクリプトを使用しました。

for (var i = 0, data = "m"; i < 40; i++) {
    try { 
        localStorage.setItem("DATA", data);
        data = data + data;
    } catch(e) {
        var storageSize = Math.round(JSON.stringify(localStorage).length / 1024);
        console.log("LIMIT REACHED: (" + i + ") " + storageSize + "K");
        console.log(e);
        break;
    }
}
localStorage.removeItem("DATA");

そこから、こんな情報を得ました。

グーグルクローム

• DOMException。
  • コード 22
  • message: "「Storage」での「setItem」の実行に失敗しました。data' の値を設定するとクォータを超えました."
  • name: "QuotaExceededError"。

Mozilla Firefox

• DOMException です。
  • コード 1014
  • message: "永続的ストレージの最大サイズに達しました。
  • name: "NS_ERROR_DOM_QUOTA_REACHED"

サファリ

• DOMException です。
  • コード 22
  • message: "QuotaExceededError。DOM Exception 22"
  • 名前: "QuotaExceededError"

インターネットエクスプローラ、エッジ (コミュニティ)

• DOMException。
  • コード 22
  • message: "QuotaExceededError"。
  • 名前: "QuotaExceededError"

私の解決策

これまでのところ、私のソリューションは、ユーザーが何かを保存するたびに余分な呼び出しを追加することです。そして、もし例外が発生した場合は、ストレージの容量が不足していることを伝えるようにします。

編集：追加されたデータを削除する

言い忘れましたが、これが実際に機能するためには、追加したデータを削除するために DATA の項目を削除する必要があります。この変更を反映させるために、上記で removeItem() 関数を使用することで反映されます。