Last reviewed by Netlify Support Staff December 2022
Note: We recommend not using both Cloudflare’s CDN (“Accelerate and Protect”, the orange cloud in their UI) and Netlify for the same site at the same time. Why? Read on!
Netlify’s web service is not designed to work optimally with another CDN “in front of” our CDN. Proxying to our service is in general not supported and we advise you not to do it for best hosting results.
Cloudflare has made similar statements that it doesn’t recommend this usage as well:
“A lot of Netlify and Vercel customers actually put Cloudflare in front of their Netlify or Vercel sites,” he added. That doesn’t really make sense when it comes to cost and performance as you’re stacking multiple CDNs."
Using Cloudflare in this way will cause issues with Netlify features such as:
- atomic deploys and rollbacks (Cloudflare will cache assets for most customers, for 5 minutes longer (at best!) than our default settings specify). This would lead to changes you make not showing up immediately on the web.
- Proxying to us completely breaks some of our features and services, like Analytics and Split Testing.
- Provide slower service than using our CDN directly (measured by a customer over a few months, using google webmaster tools)
- our Support team do not have any visibility into what happens to network requests that go through Cloudflare’s CDN (which always happens if you use the orange cloud), so we cannot easily advise you on problems in your configuration or help you debug connection trouble.
- Country-based redirects may not work reliably; we’ll look up Cloudflare’s IP, not your visitor’s, to decide which country the request comes from.
- and occasionally, catastrophic failures have been observed using this setup, and something goes wrong in the proxying. In these cases the only effective, quick fix has been disabling Cloudflare’s proxying as shown below.
For these reasons, we recommend disabling Cloudflare’s proxying (also known as “Accelerated and protected” on their service) for your site when it is being served/hosted by Netlify.
This image shows how to disable Cloudflare’s proxying, but continue using their DNS, which works great with our CDN as long as you disable proxying:
If you are making this change, you’ll need two things:
- You’ll need to make sure that our UI is configured for ALL OF your production domain(s). On the Domain settings page, ensure that all hostnames that you were using via proxy at Cloudflare are set in our UI.
- You’ll need an SSL certificate to cover these names to be in place at Netlify. If you haven’t purchased a certificate from someone else (details in this article), we’ll protect you with an automatically managed and renewed Let’s Encrypt certificate. After you change your DNS settings in our UI, we’ll start repeatedly trying to fetch a certificate for you (for as much as the next 3 days after your change), but there will likely be some downtime while your settings change at Cloudflare (which are DNS changes) propagate. This article describes what kind of delay you can expect on this process and how to make sure it goes as quickly as possible.
If you still want to proxy from Cloudflare, we can’t stop you. You may find this customer-supplied (written by @chrism2671!) Build Plugin helps mitigate the situation around them not providing a “no-cache” option for people below their Enterprise account level: GitHub - chrism2671/netlify-purge-cloudflare-on-deploy: Automatically purge Cloudflare cache on Netlify deploy.
Also please note that even if you are not following our advice, and are connecting to Netlify from Cloudflare, there is no reason to use a Cloudflare Origin Certificate on our systems Ever. You’d connect to your
https://sitename.netlify.app directly - instead of installing and having them using the broken-for-use-in-normal-browsers certificate Cloudflare provides. There is no benefit to using their certificate at Netlify, but it has caused downtime for more than one customer when they tried to transition off.
If you have any questions about this, we’ll be happy to discuss in more detail! Please feel empowered to ask BEFORE you make changes, so we can guide you to the smoothest migration experience.