-1

Note: This question is not a duplicate of similar questions where the answer calls for a javascript/php generated random number query tacked onto the end of the image names. As I explained in the original post, I can't use javascript in the code. The users are doing a one-time copy of the HTML and pasting it into locations that cannot run javascript


I run a web service that generates image files for users that show their progress on certain geocaching goals (geocaching is just an outdoor hobby.) The images sit on my server. Then, the service gives the user HTML code to reference the images and they can copy/paste that HTML into other websites such as their personal blogs or their personal profile on the main geocaching website.

The idea is that they can periodically come to my site and generate NEW updated images. The images still have the same name on the server. That way the HTML they previously copy/pasted still works...it references the same images, but those images have been updated.

However... caching is a problem. Often, I'll generate the new images, but the user will still see old images on their personal blog or wherever because the old images were cached.

  • I can give the users HTML code that tacks a random query parameter on the image src, but that won't help because they are only copying/pasting that HTML one time. The random query parameter will only be generated once, and after the first load, the images will be cached and there wont be a new random query parameter.
  • I can't give the users HTML code that contains javascript to generate the random query parameter every time the HTML is read because they are copying this HTML code into fields that usually can't run scripts.
  • I can't try to disable caching on their end obviously since they are pasting this HTML into other sites.

Is there anything I can do to disable the caching for these images from the plain HTML? Any img attribute I can use? Any ideas for solving this tricky problem?

2 Answers2

0

You can set your HTTP headers to prevent caching.

Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0

I believe this is also achievable by setting the meta-content:

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Expires" content="0"/>

Sources:

Prevent caching of HTML page

How to control web page caching, across all browsers?

Community
  • 1
  • 1
Mark
  • 4,480
  • 8
  • 44
  • 82
  • thanks @Mark, but I don't have access to the of the page that will hold my HTML code so I can't set the headers or meta tags for the page. the user is going to be pasting my html code that includes the img tags into a blog post or other field. – Cameron Kleinert Feb 16 '17 at 15:45
0

Create a

<script> 

tage inside the html block and use jvascript Math.random() method to create a random number to feed the parameter for that "random query parameter on the image src" this makes all the requests for the image be unique and prevents the cache.

Meysam
  • 466
  • 1
  • 3
  • 15
  • 1
    thanks @Meysam but from the original post: "I can't give the users HTML code that contains javascript to generate the random query parameter every time the HTML is read because they are copying this HTML code into fields that usually can't run scripts." To clarify - they are doing a one-time copy of the HTML...and that HTML can't have javascript. – Cameron Kleinert Feb 22 '17 at 16:12