How to specify a cache validator for PNG files in .htaccess?

Question

I would like to cache all images and videos on the website for at least a month at user cache to speed up the loading process.

But the http://gtmetrix.com Speed Report gives me following error:

The following resources are missing a cache validator. Resources that do not specify a cache validator cannot be refreshed efficiently. Specify a Last-Modified or ETag header to enable cache validation for the following resources:

// all *.png files currently on my page listed here //

Expiration times:

### CACHING ###
<IfModule mod_expires.c>
  ExpiresActive on
  ExpiresDefault "access plus 1 month"
# cache.appcache needs re-requests in FF 3.6 (thx Remy ~Introducing HTML5)
  ExpiresByType text/cache-manifest "access plus 0 seconds"
  ExpiresByType text/html "access plus 0 seconds"
  ExpiresByType text/xml "access plus 0 seconds"
  ExpiresByType application/xml "access plus 0 seconds"
  ExpiresByType application/json "access plus 0 seconds"
  ExpiresByType application/rss+xml "access plus 1 hour"
# media: favicon, images, video, audio
  ExpiresByType image/x-icon "access plus 1 month"
  ExpiresByType image/gif "access plus 1 month"
  ExpiresByType image/png "access plus 1 month"
  ExpiresByType image/jpg "access plus 1 month"
  ExpiresByType image/jpeg "access plus 1 month"
  ExpiresByType video/ogg "access plus 1 month"
  ExpiresByType audio/ogg "access plus 1 month"
  ExpiresByType video/mp4 "access plus 1 month"
  ExpiresByType video/webm "access plus 1 month"
# htc files  (css3pie)
  ExpiresByType text/x-component "access plus 1 month"
# webfonts
  ExpiresByType font/truetype "access plus 1 month"
  ExpiresByType font/opentype "access plus 1 month"
  ExpiresByType application/x-font-woff "access plus 1 month"
  ExpiresByType image/svg+xml "access plus 1 month"
  ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# css and javascript
  ExpiresByType text/css "access plus 1 week"
  ExpiresByType application/javascript "access plus 1 week"
  ExpiresByType text/javascript "access plus 1 week"

Cache control:

  <IfModule mod_headers.c>
    <FilesMatch "\.(ico|pdf|flv|jpe?g|png|gif|swf|ogg)$">
      Header set Cache-Control "max-age=2592000, public"
      Header unset Last-Modified
      Header unset ETag
      FileETag None
    </FilesMatch>
    <FilesMatch "\.(css)$">
      Header set Cache-Control "max-age=604800, public"
    </FilesMatch>
    <FilesMatch "\.(js)$">
      Header set Cache-Control "max-age=604800, private"
    </FilesMatch>
    <FilesMatch "\.(xml|txt)$">
      Header set Cache-Control "max-age=216000, public, must-revalidate"
    </FilesMatch>
    <FilesMatch "\.(x?html?|php)$">
      Header set Cache-Control "max-age=1, private, must-revalidate"
    </FilesMatch>
    <FilesMatch "\.(eot|font.css|otf|ttc|ttf|woff)$">
        Header set Access-Control-Allow-Origin "*"
    </FilesMatch>
  </IfModule>
</IfModule>
### / CACHING ###

What can I do to fix it?

BTW i found this: htaccess 'Header unset Last-Modified' caching issue but it looks like the guy doesn't have a problem with images

JAT JAT · Accepted Answer · 2017-11-18T04:08:56

Given this warning:

Specify a Last-Modified or ETag header to enable cache validation for the following resource

I suspect these lines in your config is the culprit:

Header unset Last-Modified

Header unset ETag

FileETag None

Your config is removing the header info used for cache validation.

How to specify a cache validator for PNG files in .htaccess?

1 Answers