71

When Chrome loads my website, it checks the server for updated versions of files before it shows them. (Images/Javascript/CSS) It gets a 304 from the server because I never edit external javascript, css or images.

What I want it to do, is display the images without even checking the server.

Here are the headers:

Connection:keep-alive    
Date:Tue, 03 Aug 2010 21:39:32 GMT    
ETag:"2792c73-b1-48cd0909d96ed"    
Expires:Thu, 02 Sep 2010 21:39:32 GMT    
Server:Apache/Nginx/Varnish

How do I make it not check the server?

Improve this question
1

6 Answers 6

Reset to default
124

Make sure you have the disable cache checkbox unchecked/disabled in the Developer Tools.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

This helped me solve the same issue. In-case you all are stuck, in the developer tools, click the gear icon at the bottom-right.
And to think I was about to write an image serving page, just to enforce cache control. THANK YOU!!
I just threw my arms up into the air demanding god to punish me for my stupidity. Also had cache disabled...
The problem existed between my keyboard and chair.
90

What do your request headers look like?

Chrome will set max-age:0 on the request's Cache-Control header if you press Enter in the location bar. If you visit your page using a hyperlink, it should use the cache, as expected.

Improve this answer

10 Comments

Request headers are also set to max-age:0 for page refreshing, which makes sense. Test using links..
@Jacob Krall, may I reverse the question. What can I do to fore Chrome always hit server for an image url, even if I visit page using a hyperlink. I have set all cache control headers, etc. but chrome never refreshes this images when navigation through anchor. IE and FF works as expected, refreshes them every time.
@thedk: what have you set the cache-control header to?
@ChrisNicholson: this works for me just now. I used the back/forward buttons to eliminate server round-trip.
A). Chrome will also set max-age:0 if you hit refresh in addition to using the location bar. B) Both these behaviors appear to be the case in Firefox as well. I can't speak to other browsers.
|
60

Wow! I was facing the same issue for quite some time.

I'll tell you why you were facing this issue. Your headers are just fine. You receive a 304 because of the way you are trying to refresh the page. There a mainly 3 ways -

  1. Press enter in the address box. You will observe chrome reads the file from the cache first and does not go to the server at all.

  2. Press f5, this would verify if the file has become stale (probably that is how you are refreshing)

  3. Press Ctrl+f5, this is unconditional reload of all static resources.

So basically - you should press the return key in the address bar. Let me know if this works.

Improve this answer

3 Comments

Press Enter in address box still reloads. Copy pasting url in new or same tab and then pressing Enter does not.
Google Chrome version 58.0.3029.110 - Clicking Enter in the Address bar did not work for me, but copy-paste of the url in a new tab, and then Enter worked... because reasons... :)
@Tushar - is there any way by which I can avoid sending the request to server in case of F5? As of now it sends the request to server, then server responds back with 304 and then it gets loaded from cache. I want browser to load it from cache directly when someone press F5, as my resources are available in disk cache.
51

For me, it was self-signed certificate:

https://code.google.com/p/chromium/issues/detail?id=110649

In the above link the Chromium Developer marked the bug: #WontFix because the rule is: "Any error with the certificate means the page will not be cached."

Therefore Chrome doesn't cache resources from servers with self-signed certificate.

Improve this answer

6 Comments

There are a lot of good answers on the page, but this has to be the crucial first step of any https pages
I am experiencing the same issue. Is there any work around for this?
@TumainiMosha you can add self-signed certificate to your browser storage. Than it'll go green and will be cached.
You saved my day!
It is cacheing now. On version 63 (mac OS)
|
7

If you want Chrome to cache your JS/CSS files - the server will need to set a "Cache-Control" header. It should look like:

Cache-Control:max-age=86400 (if you want to cache resources for a day).

Improve this answer

5 Comments

Thanks for the reply. Here are the new headers: Cache-Control:max-age=2592000 Connection:keep-alive Date:Tue, 03 Aug 2010 21:57:36 GMT ETag:"2792c73-b1-48cd0909d96ed" Expires:Thu, 02 Sep 2010 21:57:36 GMT Server:Apache/Nginx/Varnish but it still doesn't work. Chrome still checks the server for modifications.
How are you making sure that Chrome checks the server for modifications ? Are you using something like Fiddler ?
@Rahul Ctrl-Shift-I in Chrome
Note chrome caches JS/CSS by default, without a cache-control header, at least for regular page loads. On reload or shift-reload it fetches new from the server.
On devconsole, if chrome loads cached file you should see (from cache) on the size column against the file
1

I believe you are looking for

Cache-Control: immutable

Improve this answer

2 Comments

Not that currently then only browsers that support this are Firefox and Edge. developer.mozilla.org/en-US/docs/Web/HTTP/Headers/…
chrome and safari also have support for it. Please check stackoverflow.com/questions/41936772/… I believe this is the solution if you don't control client.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.