How to handle cloudfront cache after deployment

Question

we have our Angular2 code in S3 .And we access it via Cloudfront. It works fine. But after a deployment to Angular2 , we want every code to be invalidated from Cloudfront. What are the best approaches for clearing cache after deployment? How to handle cloudfront caching?

Answer 1

You will need to call the CloudFront API (or use the web console) to invalidate the cache. Here is the documentation

Answer 2

You can do both deployment and cache invalidation with the help of aws-cli.

#!/bin/bash

# enable cloudfront cli
aws configure set preview.cloudfront true

# deploy angular bundles
aws s3 sync $LOCAL s3://$S3_BUCKET \
    --region=eu-central-1 \
    --cache-control max-age=$CACHE_TIME

# invalidate cache in cloudfront
aws cloudfront create-invalidation \
    --distribution-id $CLOUDFRONT_DISTRO_ID \
    --paths "/*"

Answer 3

Please note that one problem with these solutions (as I have found out the hard way) is that the CloudFront Invalidation will probably run before the CodeDeploy has finished deploying to all EC2 instances.

Some factors are your Deployment Config, and how many EC2 instances you have. I'm thinking of adding some checks to this kind of process that gets the deployment status and will invalidate after a success