1

I have an image called webcam.jpg on the server. This image is replaced by a new image every 2 mins with the same name. I have a WordPress page to display this image.

The issue is this image getting cached in the browser, so it shows the old photo. If I clear the cache, it starts showing the latest image at that time.

I tried the below methods none of them is working for me.

<img class="weather-cam-box alignleft" src="/cameraimages/webcam.jpg?2020" alt="" width="100%" height="764" />


<img class="weather-cam-box alignleft" src="/cameraimages/webcam.jpg?2020" alt="" width="100%" height="764" />
    

<img class="weather-cam-box alignleft" src="/cameraimages/webcam.jpg?342038402" alt="" width="100%" height="764" />

Also, I tried to target this specific page and not cache the content on that page using the below code it didn't help either.

<?php if ( is_page(22683) ) {?>
<?php nocache_headers(); ?>
<meta http-equiv="cache-control" content="no-cache" />
<?php } ?>
Asanka
  • 483
  • 2
  • 8
  • 21

1 Answers1

1

You can try the following steps.

You aren't adding the query string variable. Add variable and unique random number with the timestamp.

<img src="/cameraimages/webcam.jpg?nocache=<?php echo time(); ?>">

Add following meta tag to the head

<meta Http-Equiv="Cache-Control" Content="no-cache">
<meta Http-Equiv="Pragma" Content="no-cache">
<meta Http-Equiv="Expires" Content="0">
<meta Http-Equiv="Pragma-directive: no-cache">
<meta Http-Equiv="Cache-directive: no-cache">
Mainul Hasan
  • 691
  • 3
  • 12
  • 1
    Better solution would be to create 2nd header file and load it as template. That way you can have cached and no cached headers. Another solution would be in htaccess to set images cache - https://stackoverflow.com/questions/4480304/how-to-set-http-headers-for-cache-control#answer-40665291 – Snuffy Oct 08 '21 at 06:48
  • @MartinMirchev I have used is_page(ID) to facilitate this so it will echo above meta only for that page. – Asanka Oct 11 '21 at 04:43