Image never reloads with same uri

[RyanMitchellWilson]

I am using an Image component to display a profile picture but no matter what I do to the image component it will not reload the image. I have to use the same url for the profile pictures so I tried to give the Image a unique key prop to try and get it to reload the image but it still just uses the image from cache. I have changed the image on the server countless times but the Image component only shows the original image it got for the url.

It would be great if there was a prop to pass into Image that forces it to refresh the image every time it is rendered.

In a perfect world it would display the image from cache while fetching the new image, compare the two then decide if the image has changed.

• React Native version: 0.41.0
• Platform: Both

[ramilushev]

@RyanMitchellWilson What I do as a workaround is add a meaningless query parameter to the url. Now whenever I want the image to reload, I just change that param and that invalidates the cache.

[RyanMitchellWilson]

So it turns out I was actually hitting the wrong dev environment for the picture so it just looked as though it wasn't changing when it actually was.

[RyanMitchellWilson]

Well it seems I was actually right the first time so I'm going to reopen this issue. I even gave the image a key of Math.random() and it still keeps loading from cache when the image on the server has changed multiple times

[RyanMitchellWilson]

Using @ramilushev suggestion worked but it feels hacky and probably shouldn't be needed.

[LEEY19]

@RyanMitchellWilson have you found a better solution to this ever since then? I do feel that this is an issue that the developers in FB have to look into. its been re-raised and no good solution has been given till now

[huangmr]

Same issue here (only this time with FB account images, LOL).
On iOS the image seems to refresh okey-ish after the image view is unmounted, and it also has a cache props for that.
On android the image is cached for ever unless do something like @ramilushev suggested, although it is only a workaround and not without side effects (e.g. no cache to use after path change, producing too many junk copies in the cache for the same image).
The issue probably boils down to the Fresco library (the Image component uses internally), which currently doesn't seem to have a good knowledge about when to invalidate its cache, and there is no current way of forcing it to invalidate either (or if there is one please let us know).

[wuyunqiang]

ios I can set
<Image key ={this.count++} style={{width:SCALE(200),height:SCALE(70)}} source={{uri:ver,cache: 'reload'}}/> and is ok.
but android stil bad. please let me know if it be solve.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[RyanMitchellWilson]

This is still a problem

[dbyilmaz]

@RyanMitchellWilson
Did you solve the problem?