Retrieve indexedDb quota storage data

Question

Retrieve indexedDb quota storage data

I attempted the code below to retrieve indexedDb quota storage information

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

Unfortunately, it is not functioning as expected and displaying the following error message.

Property 'webkitTemporaryStorage' does not exist on type 'Navigator'.

Is there a way to obtain indexedDb quota storage details in typescript? Any potential solutions?

angular typescript indexeddb

Answer 1

Answer №1

The issue stems from the absence of TypeScript typing. For more information, you can refer to this resource.

To resolve this problem, one approach is to specify the variable as type any:

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

Alternatively, you can extend the Navigator interface:

interface Navigator {
    webkitTemporaryStorage: {
        queryUsageAndQuota ;
    }
}

Answer 2

The issue stems from the absence of TypeScript typing. For more information, you can refer to this resource.

To resolve this problem, one approach is to specify the variable as type any:

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

Alternatively, you can extend the Navigator interface:

interface Navigator {
    webkitTemporaryStorage: {
        queryUsageAndQuota ;
    }
}

Retrieve indexedDb quota storage data

Answer №1

Similar questions

A guide on converting JSON to TypeScript objects while including calculated properties

Modify the variable value only in React when the state undergoes a change

Struggling to grasp how to implement Redux and React-router together in one component

Is it possible for member variables to be reinitialized when clicking on a Component? Are there any alternative methods to prevent this from happening

Having difficulty initializing a constant object in TypeScript

The value of req.headers('Authorization') has not been defined

tips for accessing the value outside of the subscription in angular2

Acquire Base64 Representation from an HTTP Call

Encountering numerous TypeScript errors due to a JavaScript file in Visual Studio 2017

An error is triggered when an HttpClient post does not return any data

Issue with the rendering of Navigation Bar in Angular 4 Bootstrap alpha

Step-by-step guide on making a tab the default tab in Angular with the help of Angular Material Tabs

The best approach for sending parameters to the parent class in TypeScript for optimal efficiency

Typescript error: Cannot assign type 'undefined' to type 'string | number | symbol'

Is the user's permission to access the Clipboard being granted?

The loading of woff2, woff, and ttf files resulted in a 400 error

Sorting with lodash in Angular 2

A guide to activating tag selection within the DevExtreme tag box

Exploring Angular 4's Capabilities: Navigating a Multi-Dimensional Array

What is the best approach: Developing a class or a service to handle multiple interfaces?