react-native: [Image] Cache never expires for the same uri
Even the image from the same uri is changed, <Image>
still returns cached data. The code is here: Libraries/Image/RCTImageDownloader.m#L91
There should be a parameter that makes <Image>
simply return a fresh copy of the image.
About this issue
- Original URL
- State: closed
- Created 9 years ago
- Comments: 38 (16 by maintainers)
If you need a quick fix you can add
This will however always download the image.
@umhan35 there might be a bug in the image component, but for a temporary workaround (emphasis on temporary! if there is a bug in react we should fix it), you could specify
<Image key={url} />
which will replace your old image with a new one each time the URL changes.I was going through react native node modules and in react-native->Libraries->Image->ImageSource.js, following is defined. `/**
// This is to sync with ImageSourcePropTypes.js.
type ImageURISource = { uri?: string, bundle?: string, method?: string, headers?: Object, body?: string, cache?: ‘default’ | ‘reload’ | ‘force-cache’ | ‘only-if-cached’, width?: number, height?: number, scale?: number, };
export type ImageSource = ImageURISource | number | Array<ImageURISource>; `
Which makes me think that there is prop called ‘cache’, possible values to which are given above. I added to source prop like follows.
<Image source={{uri : myImage, cache: 'reload'}} />
According to its definition, it should always reload the image from the server and not the cache. But it is not working.
To reload local images like
<Image source={require('./pic.jpg')} />
just kill terminal process which is always opened to new terminal window when simulator is started. Then restart simulator withreact-native run-ios
for example 😃I use
<img src={
/public/uploads/filename?${Math.random()}}/>
cache: ‘reload’ is not working in Android.
I ended up adding
[_URLCache removeAllCachedResponses];
to RTCImageLoader.m where it checks for cached response. I added it just to clear the cache then commented it out. I’m still new to all of this so I’m not sure where to change to have my React Native app to set a flag to clear all image cache. For now, this works while I’m still building my app.