Cache-Control: no-cache not working as expected - Apache Web Server forum at WebmasterWorld - WebmasterWorld

Forum Moderators: phranque

Message Too Old, No Replies

Cache-Control: no-cache not working as expected

Attempting to increase performance on static pages not working

jasimon9

1:12 am on Aug 18, 2017 (gmt 0)

10+ Year Member

Webserver: apache 2.4
Pages created in PHP
Test browser: Firefox

Cache-Control: no-cache
Etag: set

Relevant apache config:

RewriteRule ^(.*)\.[\d]{10}\.(css|js)$ $1.$2 [L,NC]

<filesMatch ".(css|js|jpg|jpeg|png|gif|ico)$">
Header set Cache-Control "max-age=31536000, public"
</filesMatch>

When reloading a page, all of the resources other than the html document itself are being cached as expected. The resources files that can change have fingerprints based on the modification time (which has exactly 10 digits) to allow changing, The URL rewriting maps such files to the "base" file.

The issue is that I do not see the static page as being cached. When the page is reloead via Enter in the address bar, or clicking on a link, in Firefox Dev Tools there is a Size and a Transfer size. However, for comparison, if I use the back button followed by the forward button to load the page, the html document is cached.

I am wondering what is preventing the caching. I understand the the combination of no-cache and the Etag should allow the server to return "unchanged" rather than the content.

I have seen that having a query string could prevent caching under these circumstances. At first my requests did have a query string, but I have created some files without query strings and still get the same results.

keyplyr

1:20 am on Aug 18, 2017 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

The issue is that I do not see the static page as being cached.

Because you didn't list that file type in your list.

Solution, add "html" to your list:

 <filesMatch ".(html|css|js|jpg|jpeg|png|gif|ico)$">
Header set Cache-Control "max-age=31536000, public" 
</filesMatch>

- or -
remove the files list altogether and just use the header by itself

Header set Cache-Control "max-age=31536000, public"

phranque

1:32 am on Aug 18, 2017 (gmt 0)

WebmasterWorld Administrator

10+ Year Member

Top Contributors Of The Month

jasimon9, you should read all of jdMorgan's posts in this thread.
Cache control in .htaccess:
http://www.webmasterworld.com/apache/4108533.htm [webmasterworld.com]

then i would examine and compare the request and response headers for the before and after static html page loads under both circumstances (using address bar vs forward button).
once you have sorted out the cache-related headers from all those datasets it should become clear what is happening.

keyplyr

3:07 am on Aug 18, 2017 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

Pages created in PHP

Likewise if your pages use .php extention, add that to your list, or done't use the wapper at all.

Then check the response header for the page. If the feild is present, it's working. Any discrepancy in browser results is likely specific to that browser.

jasimon9

3:42 pm on Aug 18, 2017 (gmt 0)

10+ Year Member

@keyplyr. re: your comment about it not being listed as being cached: here is more information: the filesMatch in apache is not the only place where Cache-Control is set in my application. I should have been more complete in the question. There is a PHP header command that is used for the html document in question. The PHP code looks like this:

header('Cache-Control: no-cache, max-age=31536000');
$etag = filemtime($_SERVER['SCRIPT_FILENAME']);
header("ETag: \"".$etag."\"",true);
//header('ETag: ' . $etag);

When I look in the Network pane of Dev Tools, I can see that both the Cache-Control and Etag headers are there as expected.

The scripts that I have now are for prototyping. When I get this working more code will be added to apply different cache-control headers to three categories of pages: (1) purely static pages will get the ability to be cached; (2) dynamic pages will be prevented from being cached; (3) a sub-category of dynamic pages would be any pages that have confidential information. This sub-category likely will not need different handling from the general dynamic pages; however, I am keeping in mind that some different treatment might be warranted.

jasimon9

3:43 pm on Aug 18, 2017 (gmt 0)

10+ Year Member

@phranque - I will review that thread.

keyplyr

7:33 pm on Aug 18, 2017 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

Final test is with the top browsers. That's all that really counts. If the response headers display your caching directive, then everything from then on is up to the browser.

Some tools don't read caching properly. Google Page Speed always says my pages need to use caching, however all browsers are using my caching directive properly.

jasimon9

8:50 pm on Aug 18, 2017 (gmt 0)

10+ Year Member

@keyplyr - what I am using is Chrome and Firefox. I am using the Network panel which reports the amount transferred or cached. When it gives a size there, I am assuming that means it was transferred from the server. All the other resources say "cached", but the html document gives a size when Enter in address bar, but says "cached" when back-forward button. Therefore I conclude that the information in that column is accurate as to whether it is cached or not.

So a more precise rendering of my question might be this: the headers are shown for the html document as "no-cache, max-age=31536000" and Etag is present and the same as in the response, yet it appears that the file is not cached anyways. Why is this?

keyplyr

10:39 pm on Aug 18, 2017 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

Ahhhhh.... if you want the files cached, do not use "no-cache"

"max-age=31536000" says cache the files for 1 year, so by also using "no-cache" your directives are conflicting.

But the browser has the last word. You can have all kinds of caching rules for different files, but the browser setting can & will overwrite that. Most browser defaults are cache for 1 month (max-age=2592000) and some browsers will also allow for servers to use a greater cache setting, but that is not guaranteed. Also, users can change the browser settings, although most don't.

jasimon9

4:04 pm on Aug 19, 2017 (gmt 0)

10+ Year Member

Most people seem to mis-understand no-cache. "no-cache" does not mean "do not cache" according to the documentation, and many websites. It means, "you must check with the server before using from cache." Which is what I want.

"no-store" on the other hand is quite absolute, meaning "don't even put it in the cache". That is what you want when you don't want caching.

For example, from [developer.mozilla.org...]

no-cache
Forces caches to submit the request to the origin server for validation before releasing a cached copy.

keyplyr

6:16 pm on Aug 19, 2017 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

Which would explain what you are seeing in your logs right?

BTW - this is a personal choice obviously, but while Firefox has been popular with web developers and techies, the majority of the public does not use Firefox. They use the browser that came default with the device.

So if you are designing a public document it makes better sense to test with the browser the public is using: Chrome and Edge and Safari.

Firefox adds extra space to many (but not all) CSS elements. Add a few together and it's noticeable.

jasimon9

6:45 pm on Aug 19, 2017 (gmt 0)

10+ Year Member

Thanks for you continued attention and efforts on this question.

I mainly use and develop with Chrome. I am using Firefox in this testing because our internal development server does not have a trusted certificate. Chrome will not cache css for untrusted sites. So it confuses the testing. Strangely, Chrome does cache javascript from an untrusted site.

But the reason for Firefox in this connection is as stated.

The question is still open however as to why the caching behavior is not working as described in the documentation.