How to use navigator instead of window.webkitStorageInfo HTML5 File-system API?

Question

So there is a similar post found here html-5-filesystem-access-type-error. However, I\'m not very satisfied with the conclusion because I do not feel it actually answered th

Answer 1

Recently, i've spent some time creating an abstraction layer for the Filesystem API with Persistent Storage called Chromestore.js. I've fixed this error in the abstraction layer by using the same solution talked about here. But with this API, there's no need to worry about it and it's clean.

https://github.com/summera/chromestore.js

It provides some additional functionality that is pretty handy as well. It definitely needs to be expanded upon, which I plan on doing soon. Any suggestions/feedback is much appreciated! This should make it easier for those using the FileSystem API. Especially for those trying to store large amounts of data retrieved from remote servers.

Examples and documentation are here: https://github.com/summera/chromestore.js/blob/master/chromestore-api.md

I think this has the potential to be expanded and do some really neat things with data and the Filesystem API.

Cheers!

Answer 2

Below are two examples with the current API.

It uses navigator.webkitPersistentStorage.requestQuota instead of the deprecated window.webkitStorageInfo.queryUsageAndQuota:

Query Quota

navigator.webkitTemporaryStorage.queryUsageAndQuota ( 
    function(usedBytes, grantedBytes) {  
        console.log('we are using ', usedBytes, ' of ', grantedBytes, 'bytes');
    }, 
    function(e) { console.log('Error', e);  }
);

Request Quota

var requestedBytes = 1024*1024*280; 

navigator.webkitPersistentStorage.requestQuota (
    requestedBytes, function(grantedBytes) {  
        console.log('we were granted ', grantedBytes, 'bytes');

    }, function(e) { console.log('Error', e); }
);

You have to choose either temporary (webkitTemporaryStorage) or persistent (webkitPersistentStorage) storage to query.

The current Chrome implementation tracks this specific spec version, which describes things a bit more: http://www.w3.org/TR/2012/WD-quota-api-20120703/

chromestore.js provides an easier API for this data.

---

To answer your original question, your new code would look like this:

Request quota and initialize filesystem

var requestedBytes = 1024*1024*280; 

navigator.webkitPersistentStorage.requestQuota (
    requestedBytes, function(grantedBytes) {  
        window.webkitRequestFileSystem(PERSISTENT, grantedBytes, onInitFs, errorHandler); 

    }, function(e) { console.log('Error', e); }
);

Answer 3

The error message tells you to use navigator.webkitTemporaryStorage or navigator.webkitPersistentStorage and you try to use navigator.webkitStorageInfo which is undefined.

UPDATE: PERSISTENT should not be passed to navigator.webkitTemporaryStorage or navigator.webkitPersistentStorage but only to window.webkitRequestFileSystem. Then there is no more error. (see: Filesystem API not working in Chrome v27 & v29)