I'm hosting a static site on S3, with CloudFront over the top. The issue I have is with my HTML files.
According to CloudFront's FAQ:
Amazon CloudFront uses these cache control headers to determine how frequently it needs to check the origin for an updated version of that file
What I've done so far
With this in mind I've set the HTML files in my S3 Bucket to add in the following headers:
Cache-Control: no-cache, no-store, max-age=0, must-revalidate Expires: Fri, 01 Jan 1990 00:00:00 GMT
On my first call to my
samplefile.htm, I see the following response headers (I've excluded obvious headers (e.g.
Content-Type) in order to keep to the point:
Cache-Control:no-cache, no-store, max-age=0, must-revalidate Date:Sat, 10 Dec 2011 14:16:51 GMT ETag:"a5890ace30a3e84d9118196c161aeec2" Expires:Fri, 01 Jan 1990 00:00:00 GMT Last-Modified:Sat, 10 Dec 2011 14:16:43 GMT Server:AmazonS3 X-Cache:Miss from cloudfront
As you can see, my
Cache-Control header is in there. The problem is, if I update this file and refresh I get the cached content (rather than the latest file), and I can see that CloudFront is serving its cached version by looking at the response headers:
X-Cache:Hit from cloudfront
With the above in mind, how can I achieve automatic retrieval of the latest HTML when using CloudFront?
As per its FAQ I should be able to do this with Cache-Control headers, but I can't seem to get this working.
Following the answers below
In the end I decided to change my www CNAME to point to my S3 bucket directly. Then added a new CNAME called "static", which points to CloudFront.
This means that HTML is direct from S3, which then has all its CSS/JS/IMG references pointing to static.mydomain.com