How to cache images from image URL's from a data resource in repeat?

Currently I have a data resource in firebase connected to my app. This App displays images in repeat in composer using the image component. This works fine, however every time I open the page from another page it causes the images to be downloaded every time hence the need to cache these images.

Im trying to use the “Cache file” logic node, setting the File URL to repeated.current.fields.url from my Database in repeat. I then set a Local filesystem path Page Variable from the output of the cache file node. This local file system path Page Variable is then what I bound to the image view component.

I’m getting “Url is not cacheable” as a raw error message. Anyone may know how to go about this?


1 Like

I have also noticed this behavior. Images seem to be downloaded everytime. But I once changed the source image I could see the previous image persist and needed to clear cache in order for it to actually update. That left me in doubt if the images are cached or not, after all.

I think a way to circumvent the attempt to download the images is to use them as local files instead of urls. That could bundle them up inside the build file. But I never tried that.

Hi. I have the same problem. I make this loop thats saves locally a map between the cached asset and the original URL. Then, when I try to show the image from the original URL, I try to find the local version. If not found then goes to the web.

But, sometimes the mapping get’s incorrect. And I don’t know how to resolve it.

I’d say instead of saving images into local files one could use a global canvas page array with the images saved as base64 encoded jpg or png. If the array of images is static then it could make sense to use some persistency mechanism to retrieve the array of values the next time the app is loaded. Furthermore, if the app is suppose to act as a provider then it would make sense to save its state to some storage, for instance Firebase storage and the subscribers would rely on their own local set of data… my 2 cents

That aproach could work. Now I solved implementing a file API that responds with the image file and depending on a parameter get the same image or not.

Then the cache system works alone.

If I want to change the cached file just I change a value on the config API that makes a change on the URL of the file.