How to prevent http file caching in Apache httpd (MAMP)

Question

I am developing a single page Javascript application in MAMP. My JavaScript and HTML template files are getting cached between requests.

Is there a simple way to indicate in MAMP that I want to prevent http file caching? Possibly with a .htaccess file? Where do I place the .htaccess or modify the virtual host for MAMP on Mac?

Solution 1

Tried this? Should work in both .htaccess, httpd.conf and in a VirtualHost (usually placed in httpd-vhosts.conf if you have included it from your httpd.conf)

<filesMatch "\.(html|htm|js|css)$">
  FileETag None
  <ifModule mod_headers.c>
     Header unset ETag
     Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
     Header set Pragma "no-cache"
     Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
  </ifModule>
</filesMatch>

100% Prevent Files from being cached

This is similar to how google ads employ the header Cache-Control: private, x-gzip-ok="" > to prevent caching of ads by proxies and clients.

From http://www.askapache.com/htaccess/using-http-headers-with-htaccess.html

And optionally add the extension for the template files you are retrieving if you are using an extension other than .html for those.

Solution 2

Based on the example here: http://drupal.org/node/550488

The following will probably work in .htaccess

 <IfModule mod_expires.c>
   # Enable expirations.
   ExpiresActive On

   # Cache all files for 2 weeks after access (A).
   ExpiresDefault A1209600

  <FilesMatch (\.js|\.html)$>
     ExpiresActive Off
  </FilesMatch>
 </IfModule>

Solution 3

I had the same issue, but I found a good solution here: Stop caching for PHP 5.5.3 in MAMP

Basically find the php.ini file and comment out the OPCache lines. I hope this alternative answer helps others else out as well.

Solution 4

Without mod_expires it will be harder to set expiration headers on your files. For anything generated you can certainly set some default headers on the answer, doing the job of mod_expires like that:

<?php header('Expires: '.gmdate('D, d M Y H:i:s \G\M\T', time() + 3600)); ?>

(taken from: Stack Overflow answer from @brianegge, where the mod_expires solution is also explained)

Now this won't work for static files, like your javascript files. As for static files there is only apache (without any expiration module) between the browser and the source file. To prevent caching of javascript files, which is done on your browser, you can use a random token at the end of the js url, something like ?rd=45642111, so the url looks like:

<script type="texte/javascript" src="my/url/myjs.js?rd=4221159546">

If this url on the page is generated by a PHP file you can simply add the random part with PHP. This way of randomizing url by simply appending random query string parameters is the base thing upôn no-cache setting of ajax jQuery request for example. The browser will never consider 2 url having different query strings to be the same, and will never use the cached version.

EDIT

Note that you should alos test mod_headers. If you have mod_headers you can maybe set the Expires headers directly with the Header keyword.

Solution 5

<FilesMatch "\.(js|css)$">
  ExpiresActive On
  ExpiresDefault A1
  Header append Cache-Control must-revalidate
</FilesMatch>

View more solutions

Comments

[dmck]

Unfortunately this does not work when I put a .htaccess file in my project directory. I'm not sure if mod_expires is active.

[dmck]

Thanks, unfortunately I am not using any PHP files. I will look into mod_headers and installing mod_expires.

[Stennie]

@dmck: remove the <IfModule mod_expires.c> and </IfModule> section .. if mod_expires isn't enabled, you'll get an error instead of those directives quietly being ignored.

[dmck]

Thank you, this works very well in a .htaccess file. I can see the cache control options when I inspect the headers and my files are showing up with http 200 instead of 304 between requests, just what I needed.

[Spenhouet]

Don't forget to add the LoadModule command. LoadModule headers_module lib/modules/mod_headers.so

[Flion]

that is about PHP caching on the server side, a.k.a OPCache. The question is about files being cached by the browser that are requested over HTTP.

[Thariq Nugrohotomo]

Can I apply those header to all file types, instead of defining extensions one by one?

[Charlie Rudenstål]

@ThariqNugrohotomo Yes it's possible! It's a regular expression, you can try <filesMatch "\.+"> or <filesMatch ^>

[SDsolar]

In a project directory any slight syntax error here can cause a 500 error.

[andruo11]

I'm not using MAMP but Apache on a web server. I had to also enable headers and expires modules on my Apache installation by typing "sudo a2enmod headers" and "sudo a2enmod expires", and then sudo service apache2 restart. The LoadModule and IfModule commands/tags weren't necessary -- just omit the bracketed IfModule tag parts above but still enter the Header settings between them. –

[Aaron Franke]

What about for preventing caching of CSS files?

[Aaron Franke]

Doesn't seem to work. If I change a file on the server and refresh the page, nothing happens, but if I wait 5 minutes, it does change. There's some kind of server-side cache that persists even after restarting Apache.

[leopal]

That's not a good quality answer. Try to explain in detail what are the steps for resolving the issue reported on the OP.

[Speravir]

For this peculiar Expires date see Why does WordPress use 11 Jan 1984 as an anti-caching value for Expires headers? and for a very similar date used in PHP cf. Why is "Expires" 1981?