Question

I have a web form that takes C++ code, compiles it on the server, and then spits the output out. The C++ code in question writes out to a BMP file that can be viewed on the web page. This is interfaced via AJAX. My main issue is that whenever I recompile the program to change an image, the image in question does not change unless I refresh the page. Therefore I assume it is a caching problem. Here are the steps:

1. Person inputs C++ code
2. Person presses submit
3. C++ code is sent to compile.php
4. compile.php compiles program and displays all the images in the directory

If a person changes the color of the image in the program and resubmits the form, the submit is successful but the image does not change unless the page is refreshed. I verified this when I changed the output filename and it creates a new image with the correct colors, but if you recompile the program with the same filename, that particular image does not change unless you refresh the page.

I tried putting no-cache headers at the top of the PHP files.

<?php
header("Expires: Mon, 26 Jul 1990 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
?>

Answer 1

To solve the issue, you could try disabling caching in your Javascript library when making the AJAX request. For JQuery, set cache to false.

Another solution is to manually append a cache-busting parameter when making the request. For example, instead of making an AJAX request to compile.php, make a request to compile.php?123456 where 123456 is the current timestamp. This should force the browser to not use the cached copy.