0 votes
1 view
in AWS by (19.2k points)

So I have hosted my angular app on s3 with a CloudFront dist. I do file revision-ing (using grunt filerev) to make sure that I never get stale content. But, how should I version the index.html file? It's required because all other files are referenced inside index.html.

I have configured my bucket to be used as a static site. So it just picks up the index.html when I reference the bucket in URL.

Cloudfront says that you should set min TTL to 0, so it would always hit origin to serve the content. But, I don't need this since I am doing file revisioning of all my files (except index.html). I can take advantage of CDN caching for these files.

They also say that in order to invalidate a single object, set the max-age headers to 0. I tried adding following to my index.html

<meta http-equiv="Cache-Control" content="public, must-revalidate, proxy-revalidate, max-age=0"/>

But this does not reflect once you upload on s3. Do I need to explicitly set headers on s3 using s3cmd or dashboard? And do I need to do this every time when index.html changes and I upload it?

I am aware that I could invalidate a single file using cmd but it's a repeating process and It would be great if it can take care of itself just by deploying on s3.

1 Answer

0 votes
by (44.6k points)

These two commands can do it.

To deploy the code:

aws s3 sync ./ s3://bucket-name-here/ --delete

Create an invalidation in CloudFront:

aws cloudfront create-invalidation --distribution-id <distribution-id> --paths /index.html

Welcome to Intellipaat Community. Get your technical queries answered by top developers !