How to set limit on cordova.file.cacheDirectory and delete all files from there? (iOS and Android)

[sami...@gmail.com]

Hi I am building a small app. 

It uses dynamic images. To improve performance I am caching those image into local cache using cordova plugin File & File-Transfer 

storage: cordova.file.cacheDirectory 

I want to set 50mb limit. After that it should remove the oldest cache file. 

Alternatively How can I delete all (clear cache) from cache directory ? 

Target platform: iOS and Android 

Thanks in advance

I am using Cordova CLI and phonegap desktop+developer app to test, not phonegap build

[Jesse Monroy]

@Sami,
on thing that is not entirely clear about Phonegap Desktop is that it *requires* Phonegap Developer App.

If plugin is not in Phonegap Developer App,  you cannot use that plugin.

On your App, PDA has the file plugin. Have you read all the "quirks" section for each platform and each feature?

Jesse

[Kerri Shotts]

You'll need to manage the cache yourself. So, keep track of what & how much you store there, and if it's over 50MiB, you get to clear it out, assuming the OS hasn't already done it for you (cache directories are not persistent). In order to remove files, you'll use the File API (either keep track of the files you download and delete those, or use the File API to get a directory listing and iterate over those).

Do keep in mind that the PG Developer app is itself a phonegap app, and so you're actually referring to its cache directory when using it for testing. So it is entirely possible you might have other data in that directory from other apps you're testing.

One last word of warning: don't try to load application assets using the File plugin when using the PG Developer app -- it will fail (you'd be loading from the PG Dev app's bundle, not your own app).

On Friday, April 15, 2016 at 9:37:39 AM UTC-5, sami...@gmail.com wrote:

...

[sami...@gmail.com]

Thanks Kerri

Useful information.

This is what I am thinking-

1) Every time the app starts, it will call a JS function.

2) This function will go through cordova.file.cacheDirectory and make a file list

3) Using the list it will find total size and older files.

4) If file size is greater than 50mb- start to delete (using a loop -> delete oldest -> check total size again -> delete oldest....)

Do you think it would be a good idea? 

Hope it won't affect on performance much.

Now, I have gone through "File" plugin documentation and still not sure how to-

1) List all files in that directory

2) Delete a file.

I will keep researching & googling but if you know or have any example codes; would you mind sharing?

Appreciate your replies and assistance.

S

[Kerri Shotts]

See inline:

On Monday, April 18, 2016 at 10:00:36 PM UTC-5, sami...@gmail.com wrote:

Thanks Kerri

Useful information.

This is what I am thinking-

1) Every time the app starts, it will call a JS function.

2) This function will go through cordova.file.cacheDirectory and make a file list

3) Using the list it will find total size and older files.

4) If file size is greater than 50mb- start to delete (using a loop -> delete oldest -> check total size again -> delete oldest....)

Do you think it would be a good idea? 

Hope it won't affect on performance much.

I could see a perf hit using that method if you had a lot of files. It might be simpler to maintain a small SQLite or IndexedDB database that recorded the files you downloaded and their sizes, as well as their age. Then you wouldn't have to take the hit of traversing the file system to determine what is and isn't present -- just run a query on your DB, execute file deletes (if an operation fails, then the file was probably nuked by the OS anyway, so we don't care), and then update your DB appropriately. Far faster that way, I think.

If you do this on startup, don't make the user wait on it, either. I'd worry about cleaning up your cache a little after you've started the app so that users don't have to wait on your startup routines. [This assumes that cleaning the cache doesn't block the UI in any way.]

Worth mentioning that some apps just offer a button in their settings view that clears the cache at the user's command. 

 

Now, I have gone through "File" plugin documentation and still not sure how to-

1) List all files in that directory

You can use a DirectoryReader. See https://developer.mozilla.org/en-US/docs/Web/API/DirectoryReader

 

2) Delete a file.

You should be able to call "remove" on it. See https://developer.mozilla.org/en-US/docs/Web/API/Entry#remove

 

I will keep researching & googling but if you know or have any example codes; would you mind sharing?

I have some ancient code that wrapped the File API with promises (using Q): https://github.com/photokandyStudios/YASMF-Next/blob/0.5/lib/yasmf/util/fileManager.js

But it's probably not going to be a lot of use to you, and I can't even guarantee that it still works. But it might be a good idea to make a newer version that works with the native promises of modern browsers... hmm.

 

Appreciate your replies and assistance.

S

Hope that helps!