Yeaph, I spent all the weekend figuring out how to Cache my entire site in CloudFront. I had really a lot of issues until understand the correct configuration to do things work well.
I this approach it’s not necessary install any cache plugin (ie W3 Total Cache) in WordPress.
Here is the current scenario:
- Route 53 with A alias pointing to CloudFront (for my naked domain and www)
- CloudFront with Origin Domain Name = load balancer DNS name, also the cname are configured to naked domain and www
- Load Balancer with EC2
- EC2 with several sites (I just want use CF in one of them)
All changes that did was in CloudFront configuration, no changes in the application or server were necessary.
I took a couple of screenshots to show exactly how is the configuration in CF.
CloudFront General Information
Origin Settings in CloudFront
The trick is in the Behaviors options. First, in changed a little but the Default to:
Edit Behavior CloudFront
You can see that I did a couple of changes from the defaults settings, but the most important here was set the Forward Headers to Whitelist and add Host in the Header, without the CloudFront was caching my default index.html from Apache, the reason of that is because the CloudFront was hitting the LoadBalancer URL, so a default index was being shown.
Another trick, is to try to avoid admin pages to being cached. So Added:
Cache Behavior Settings CloudFront
Well, now things seems work fine!
Developer Tool – Hitting cloudfront
Just quick note: In this way, all changes that you do in your site will be take effect just 24 hours after publish. Or, you need “invalidate” objects in CF.