3

when I open the profile tab it loads an image (profile image) from an URL and if a user wants to change his image he can but when he does the image is changed on the Server but on the App it doesn't change but if I refresh the App it does change.

The URL doesn't change when the user logs he has a image on the URL and when he updates the image the URL is the same but the picture is different.

<Image style={{height: 70, width:70,borderRadius: 35}} source={{uri:'http://********************/'+GLOBAL.api_token}} />
Brunaine
  • 1,178
  • 2
  • 16
  • 24
  • 1
    Please try follow approach and let me know you feed on this After user select picture you need to call API and after success come form API you need to update URL so for this take URL in one variable and after success response change values of that URL variable and also give key={URL} to image parent view. – Nisarg Thakkar May 15 '17 at 10:46
  • doesn't work , tried using key and updating the URL but it doesn't change – Brunaine May 15 '17 at 11:06
  • Can you please try following method – Nisarg Thakkar May 15 '17 at 11:13
  • (If image changed){ } else { } – Nisarg Thakkar May 15 '17 at 11:15
  • I didn't try yet but if the URL stays the same all the time that won't change anything, the image on the URL changes but not the URL , but i will try in a bit and tell you something – Brunaine May 15 '17 at 11:26
  • Ok i got it. just make local param with bool values when image change you need to change it values And after use my above code condition with new param same code only different is in IF-ELSE both image url is same When if else switch image tag is change so its fetch new image from url – Nisarg Thakkar May 15 '17 at 11:33
  • that was a bit confusing but i will try in a bit , im not on it right now in some minutes i will – Brunaine May 15 '17 at 11:39
  • can you give an example? i kinda got lost – Brunaine May 15 '17 at 13:26
  • @NisargThakkar Appreciate that this post is very old, but your comment about adding a key to the parent view solved my issue, just wanted to say thanks :-) – Richlewis Mar 04 '22 at 13:44

2 Answers2

7
if(imagechanged(localparam)) {
  <Image source={{uri:ImageURL}} /> 
} else { 
  <Image source={{uri:ImageURL}} /> 
}

In if else you need to do same image URL but change is in condition.

you just need to set local param to know image is changed in URL or not.

For cache issue just add date param after the URL so every time its take new image. like follow

imageURL = "http://localhost/image/id/image.jpg?time=" + new Date();
Nisarg Thakkar
  • 1,497
  • 16
  • 25
  • 1
    I tried this. But still the image takes hell lotta time to load, despite being small < 1mb – Pavan Nov 07 '17 at 11:52
  • The image variable not get updated for few seconds. If I delete or uploaded an image, after a click on the link it will show the image or deleted message. But this will reflect after some time in other user's posts. https://stackoverflow.com/questions/60881413/local-images-are-unable-to-view-by-the-other-users-while-click-on-the-link-in-re – sejn Mar 27 '20 at 09:24
1

based on https://github.com/facebook/react-native/issues/9195#issuecomment-374933233

it's worked to me use cache cache: 'default' | 'reload' | 'force-cache' | 'only-if-cached',

<Image
    source={{ uri: https://placeimg.com/640/480/any, cache: "reload", }}
    style={{ width: 50, height: 50, borderRadius: 25 }}
/>
Roma Debrian
  • 11
  • 2