title: Amazon Cloudfront Cache-Control: no-cache header has no effect after 24 hours
body: <p>I'm hosting a static website in S3 and using Cloudfront to cache files. I've essentially got 3 files with the following headers:</p>
  
  <ul>
  <li>index.html (Cache-Control: no-cache)</li>
  <li>app.js (Cache-Control: max-age=63072000, public)</li>
  <li>style.css (Cache-Control: max-age=63072000, public)</li>
  </ul>
  
  <p>My html file uses query string parameters that get updated every time I update my css or js files. I've configured s3 to pass these parameters through and I've verified that it works to invalidate cached resources. My index.html file looks something like this:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          ...
          &lt;link rel="stylesheet" href="app.css?v=14113e2c764"&gt;
      &lt;/head&gt;
      &lt;body&gt;
          ...
          &lt;script src="app.js?v=14113e2c764"&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>It seems to work great as I push updates all day, but when I come in the next morning and push my next change, The index.html file is out of date. Instead of having the correct ?v= parameter, it has the old one! The only way to fix it is to invalidate the html file manually. Then everything works for the rest of the day. The next day I have the same problem again.</p>
  
  <p>What's going on here?</p>