複数のシナリオを書庫にしまう(容量に伴うあれこれ)
ゲームブック、現在複数のシナリオを書庫にしまって、Bookの切り替え等が出来るよう開発中です。
(シナリオの作成はこれが完了した後になります）
そこで気になるのがStorageの容量です。
技術的には、
ブラウザーのストレージ制限と削除基準
https://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria
ハードドライブの空き容量が 500GB であれば、ブラウザーの合計ストレージサイズは 250GB
とテキスト保存であれば膨大と言ってよいサイズが使えます。
とは言え目安は必要だろうという事で、Storageの使用容量や空き容量を調べるコードを探してみました。
ウェブ用ストレージ
https://web.dev/i18n/ja/storage-for-the-web/
利用可能なストレージの量を確認するにはどうすればよいですか？
https://web.dev/i18n/ja/storage-for-the-web/#check
の以下のコードを参考にさせていただきました。
---------------------------------------------------------------
if (navigator.storage && navigator.storage.estimate) {
const quota = await navigator.storage.estimate();
// quota.usage -> Number of bytes used.
// quota.quota -> Maximum number of bytes available.
const percentageUsed = (quota.usage / quota.quota) * 100;
console.log(`You've used ${percentageUsed}% of the available storage.`);
const remaining = quota.quota - quota.usage;
console.log(`You can write up to ${remaining} more bytes.`);
}
---------------------------------------------------------------
実装および使用上の注意としては、
・このコードを含む関数の先頭に"async"キーワードをつける
例:async fnCalcSpace(){・・・}
・クリップボードAPIと同様にHTTPSのサイトで無いと動作しない
の2点があります。
なお筆者の環境では
You've used 0.005698725581169128% of the available storage.
You can write up to 10736806344 more bytes.
と言った数値でした。
