Enable Cloudflare SSL for custom domains on Azure Storage Static Web Hosting.
Overview
Static Web Hosting allows an Azure storage container to directly serve static content. However, the current Azure Static Web Hosting technology stack does not support SSL for certain URLs. For example, if foo.com were the domain using Static Web Hosting, traffic destined for https://www.foo.com and https://foo.com could not use SSL. However, proxying Static Web Hosting Applications through Cloudflare allows SSL to be enabled for these URLs.
Static Web Hosting enables https with the following URLs, for example, if foo.com is the domain:
https://<<account>>.blob.core.windows.net/ https://<<account>>.<<foo.com>>.web.core.windows.net
A Static Web Hosting custom domain, foo.com, uses a CNAME to point to another CNAME which utilizes the *.blob, *.web URLs. That CNAME then resolves to another CNAME which is the A record of the FE pool for the Azure storage account. To clarify this configuration, see the following example:
storage.foo.com CNAME foo.blob.core.windows.net foo.blob.core.windows.net CNAME blob.exampleprdstr01.store.core.windows.net blob.exampleprdstr01.store.core.windows.net A 13.78.152.64Route traffic from the Static Web Hosting application to Cloudflare in order to enable Cloudflare SSL:
Browser <—SSL—> Cloudflare Proxy <—SSL—> Static Web Hosting
Setup a Cloudflare Account to get started.
Create a Cloudflare Account
To receive SSL on a custom domain:
1. Create a new Cloudflare account or use an existing account.
2. Enter the name of your custom domain under Add Your Site.
3. Cloudflare queries authoritative DNS servers for the DNS records registered for the domain.
Choose a plan
Select the Free, Pro, or Business plan for the domain. If you choose Free or Pro, Cloudflare will generate an SSL certificate for communications between browsers and the Cloudflare proxy. If you prefer to upload your own SSL certificate to Cloudflare, choose the Business plan.
Select a DNS Method
If you want Cloudflare to provide authoritative DNS, use the Cloudflare nameservers provided for your domain and place them in the DNS manager of your domain registrar.
If you want to use the CNAME method, you’ll need to follow additional steps.
Select an SSL Method
When logged into your Cloudflare account, select the Overview tab SSL/TLS app. The default SSL setting is Flexible SSL; however, there are other SSL options.
Because DNS settings are cached in various locations throughout the Internet, including on a client's browser, changes to SSL settings may take time to propagate and start functioning as expected.
If you want an HTTPS connection between CF and Azure, a valid SSL certificate must be installed on the blob itself. Since this is enabled in Azure by default, you may immediately change your SSL settings to Full or Full (strict) to ensure encryption between the client, Cloudflare, and Azure.