How to integrate CloudFlare services with Web App?

Question

How to integrate custom domains with CloudFlare services? I've just created a web app. Currently we cannot map the cloudflare to the custom domain because the cloudflare's A name will have their proxy ips rather than the custom domain IP on the azure.

Answer 1

Hi Kefei Qian,

You're correct, Cloudflare uses proxy IPs rather than traditional A record IPs, which conflicts with Azure App Service’s requirement for direct IP pointing or a CNAME.

Azure Web Apps validate domains using either an A record pointing to Azure's IP address (which fails when Cloudflare proxy is enabled) or a CNAME for subdomains, which works with CNAME flattening.

The issue with using an apex/root domain on Cloudflare is that Cloudflare doesn't support root-level CNAMEs without flattening, and Azure cannot verify domains through Cloudflare's proxy IPs.

To ensure your custom domain works correctly with your web app when using Cloudflare, follow these steps:

• Temporarily disable the Cloudflare proxy by setting the DNS record for your Azure Web App to DNS only (gray cloud) in the Cloudflare dashboard instead of Proxied (orange cloud).
• Add and verify your custom domain in Azure by going to your Web App > Settings > Custom domains, add your domain, and Azure will verify it once the correct DNS records are detected.
• Once the domain is verified, remove the A record, add a CNAME for @ pointing to your Azure app URL, and enable the Cloudflare proxy (orange cloud) to use CNAME flattening and benefit from Cloudflare features.
• Enable HTTPS by turning on HTTPS Only and setting up TLS/SSL bindings in Azure and use Cloudflare’s free SSL with Full or Full (Strict) mode based on your certificate configuration.

Please accept as "Yes" if the answer provided is useful, so that you can help others in the community looking for remediation for similar issues.

Let me know if you have any further Queries.