Masonry Card Images not Refreshing

Wappler General How To
#1

I have images in masonry cards. When I update the image on the server the old image still shows and I can’t seem to get it to refresh. I’m using Chrome and CTRL+F5 doesn’t work. If I right click on the old image that is shown and select Open Image in New Tab the new image opens. The correct image is shown in other places as well. It’s just stuck on the Masonry page. If I close the tab and reopen the correct one comes up, but that’s not a viable solution. Any thoughts on how to force the correct image to be shown? Thanks.

<img class="card-img-top" alt="Card image cap" data-sizes="auto" dmx-bind:data-src="" dmx-bind:src="featured_image==1 ? '/media/featured_images/thumbs/' + tripbit_id + '.jpg' : ''" dmx-show="featured_image==1">

#2

Well it all seems like the browser cached your image. I don’t think it’s related to the masonry component.
Are you maybe also using the cache option for the server action?

#3

I don’t think I’m using the cache option for the server action. Where would I check that?

#4

Well in the properties of the server connect component in App Structure :slight_smile:
When you say that you change the image - are you changing the actual image file or the dynamic value?

#5

Nope, not caching (should look at that soon though. :grinning:)

I’m actually overwriting the file on the server.

#6

Then it’s a browser cache issue :slight_smile:

#7

Ok. I’ll do more research on that. Thanks.

#8

Also if you are using some service like cloudflare it can be caching everything really hard.

#9

I find refreshing the page in chrome with dev tools open helps with cache issues as by default caching is off with dev tools open.