HTTP caching confusion

15,651

Solution 1

You need to use the Expires directive, otherwise the browser will always check to see if the content has updated.

If a cached entry has a valid expiration date the browser can reuse the content without having to contact the server at all when a page or site is revisited. This greatly reduces the number of network round trips for frequently visited pages. For example, the Google logo is set to expire in 2038 and will only be downloaded on your first visit to google.com or if you have emptied your browser cache. If they ever want to change the image they can use a different image file name or path.

To change in IIS7 use following. This is easiest to manage if you keep static content in specific directories.

Log onto the server
Open IIS Manager (start -> adminstrative tools -> iis manager
Expand the server node
Expand the sites node
Open the site and navigate to the directory you want to change
Open the IIS HTTP Response Headers section
Click Set Common Headers on the task pane on the right
Set "Expire Web Content" as your app requires.

Solution 2

use expires header instead of using the cache-control.Tell your server for the first time that serve me content from my browser cache until this expiry date. There will be no cross checking for changes in file until your expiry date.

add the header in your web.config’s system.webServer section like so:

<system.webServer>
    <staticContent>
        <clientCache httpExpires="Sun, 29 Mar 2020 00:00:00 GMT" 
                     cacheControlMode="UseExpires" />;
    </staticContent>
</system.webServer>
Share:
15,651

Related videos on Youtube

Keith
Author by

Keith

Keith Henry Chief Software Architect, building offline-first and responsive applications in the recruitment industry. I'm also on Linked In. Email me on Google's email, my address is ForenameSurname.

Updated on April 24, 2022

Comments

  • Keith
    Keith about 2 years

    I'm not sure whether this is a server issue, or whether I'm failing to understand how HTTP caching really works.

    I have an ASP MVC application running on IIS7. There's a lot of static content as part of the site including lots of CSS, Javascript and image files.

    For these files I want the browser to cache them for at least a day - our .css, .js, .gif and .png files rarely change.

    My web.config goes like this:

    <system.webServer>
        <staticContent>
            <clientCache cacheControlMode="UseMaxAge" 
                         cacheControlMaxAge="1.00:00:00" />
        </staticContent>
    </system.webServer>
    

    The problem I'm getting is that the browser (tested Chrome, IE8 and FX) doesn't seem to be caching the files as I'd expect. I've got the default settings (check for newer pages automatically in IE).

    On first visit the content downloads as expected

    HTTP/1.1 200 OK
    Cache-Control: max-age=86400
    Content-Type: image/gif
    Last-Modified: Fri, 07 Aug 2009 09:55:15 GMT
    Accept-Ranges: bytes
    ETag: "3efeb2294517ca1:0"
    Server: Microsoft-IIS/7.0
    X-Powered-By: ASP.NET
    Date: Mon, 07 Jun 2010 14:29:16 GMT
    Content-Length: 918
    
    <content>
    

    I think that the Cache-Control: max-age=86400 should tell the browser not to request the page again for a day.

    Ok, so now the page is reloaded and the browser requests the image again. This time it gets an empty response with these headers:

    HTTP/1.1 304 Not Modified
    Cache-Control: max-age=86400
    Last-Modified: Fri, 07 Aug 2009 09:55:15 GMT
    Accept-Ranges: bytes
    ETag: "3efeb2294517ca1:0"
    Server: Microsoft-IIS/7.0
    X-Powered-By: ASP.NET
    Date: Mon, 07 Jun 2010 14:30:32 GMT
    

    So it looks like the browser has sent the ETag back (as a unique id for the resource), and the server's come back with a 304 Not Modified - telling the browser that it can use the previously downloaded file.

    It seems to me that would be correct for many caching situations, but here I don't want the extra round trip. I don't care if the image gets out of date when the file on the server changes.

    There are a lot of these files (even with sprite-maps and the like) and many of our clients have very slow networks. Each round trip to ping for that 304 status is taking about a 10th to a 5th of a second. Many also have IE6 which only has 2 HTTP connections at a time. The net result is that our application appears to be very slow for these clients with every page taking an extra couple of seconds to check that the static content hasn't changed.

    What response header am I missing that would cause the browser to aggressively cache the files?

    How would I set this in a .Net web.config for IIS7?

    Am I misunderstanding how HTTP caching works in the first place?

    • Sripathi Krishnan
      Sripathi Krishnan almost 14 years
      If you hit refresh or F5, the browser will always make a server request (possibly a conditional request) regardless of the cache settings
  • Keith
    Keith almost 14 years
    How would I do that in IIS7? Also - why does that work when cache-control doesn't?
  • Keith
    Keith almost 14 years
    Thanks for the clarification - so is cache-control broken?
  • Keith
    Keith almost 14 years
    Thanks - your steps in IIS7 will actually produce the same web.config XML that is in my question though.
  • sushil bharwani
    sushil bharwani almost 14 years
    no i believe there something both you and i are missing i am reading more on cache-control at this point will let you know if i figure out clear. Yes but did my suggestion worked for you
  • Keith
    Keith almost 14 years
    Your XML config here sets the static content to use the HTTP Expires header, while mine in the question causes it to use the Cache-Control header. After some investigation it appears that either works fine, though some really old browsers don't recognise Cache-Control (before IE 5.5). Lots of advice on the web states to use Expires, but we don't support IE5 so it's not a problem. Thanks for the answer(+1)