Detecting Available Storage with IndexedDB

Question

I have written an offline application that utilises IDB to store images and text that would normally exist in a MySQL DB for offline use.

However, I am trying to figure out a way that I can read the limit on the devices storage for IndexedDB. I am currently using the following method to determine this although it only works in Chrome.

I am using the snippet from here https://stackoverflow.com/a/18350531/4121257 which gets the storageInfo for WebKit based however if someone knows a way to get it on FF & IE & more specifically Safari that would be great.

From what I have gathered this returns the used quota for everything stored by that browser for the domain not just IDB. However, what I am using is the remaning quota. From this I either perform an AJAX request to the server to get the estimated size of all the files that will be stored and work out if there is enough storage or I will calculate the ammount stored in the IDB and work out if there is enough to store more.

I was wondering if someone had a more 'streamlined' approach? And a way to check the remaning quota in FF/IE and especially Safari & even a way to check quota for IDB specifically.

Answer 1

The only API that is currently available and only for chrome is navigator.webkitTemporaryStorage.queryUsageAndQuota().

Firefox had plans to implement this API too.

There are also two experimental APIs navigator.storageQuota.queryInfo(type) and navigator.storage.estimate() available if you run chrome with --enable-experimental-web-platform-features. More details here: https://groups.google.com/a/chromium.org/forum/#!searchin/blink-dev/quota-api/blink-dev/P6eY26vB91c/Ri4ohXOPBQAJ

I think the Storage quota estimate() API is the most interesting one. It is still a draft but chrome and mozilla are currently implementing this API.

Unfortunately there is currently no public info available when and if Edge and Safari will implement this API.

Edge currently has a very different model for quota - rather than a whole-origin limit, each storage type (indexed db, local storage, etc) has its own limit.

Update: This feature was added to Chrome 52 (experimental flag) and Firefox 51 (nightly) navigator.storage.estimate().then((data)=>console.log(data)) // Object { quota: 2147483648, usage: 0 }