Firebase storage Image cache not working

Question

There are two image uri, first one is located in firebase storage and second one is a sample image in react-native blog.

And I believe recat-native's Image component is cacheable.

<View>
   <Image 
       style={{ width: 100, height: 100 }}
       source={{ uri : 'https://firebasestorage.googleapis.com/v0/b/siren-5eee7.appspot.com/o/profile%2FmO2vxzWDbJRzM5ckzCBXtf0aPhV2?alt=media'}}
    />

    <Image 
       style={{ width: 100, height: 100 }}
       source={{ uri : 'https://facebook.github.io/react-native/img/react-native-congratulations.png'}}
    />
<View>

Problem

I think firebase storage's image is not cached. when I render screen it always trying to download. So the second image load faster, and after one second, firebase image is loaded.

How can I make firebase storage image cacheable?

You can test above code!

Answer 1

https://firebase.google.com/docs/reference/js/firebase.storage.SettableMetadata#cacheControl

See this documentation I think you have to set metadata while storing the image to the Firebase storage.