Clear CloudFlare Cache on Deployment

If you use a deployment service and your site makes use of CloudFlare, here's how you can clear items programmatically.

We have some sites that are making use of CloudFlare as our CDN and for most of of our projects, we use DeployHQ to deploy sites into their respective environments using Git (we also have a CodeShip instance for 1 project).

On one particular project, we have the compiled Sass stored in our Git repo and deployed by Git as well. This isn't ideal and this is why we started to use CodeShip on another project. The trouble you have with either deployment though is that it could be a while before your new CSS (or JavaScript) gets picked up by CloudFlare.

Now you could of course manually clear the cached items each time or clear the entire cache (resource intensive) or you can use deployment hooks to the CloudFlare API.

So within DeployHQ > Your project name > Settings > Notifications you can add a CloudFlare API endpoint call.

Our looks a little like this

So now each time our server deploys, this call is going to remove the cached compiled CSS and then it'll grab the new version.

Super simple and we can be assured that on each deployment, are changes are visible immediately.