Azure static website with a HTTPS enabled custom domain

Azure static website with a custom domain

As example project I'll create a static website called sunshine, just for convenience a recognizable word. I want this website to be hosted in Azure and it should be accessible by a secure connection at my custom-domain.

In the following steps I explain what tasks needs to be done to get up and running with your website and custom-domain I use Azure CLI commands to complete most of the tasks. Here we go!


Custom domain

As you probably guessed, you need a custom domain. One requirement is that you need to have the possibility to add CNAME records.

Azure subscription

There is an Azure subscription required to create and manage azure resources.

Azure Command-Line Interface (CLI)

During this blog I will use the Azure Command-Line Interface (CLI) for creating and managing the Azure resources. The installation and use of the CLI is described on the Azure Command-Line Interface (CLI) documentation page.

Resource group

First step is to create an Azure resource group for logical grouping of our created resources.

az group create --name rg-sunshine-demo --location westeurope

If you have difficulties reading my naming convention; I'll use Microsoft's Recommended naming and tagging conventions.

Storage account

For hosting the static website, a storage account is required. The az storage account create command creates a new storage account. Dashes (-) are not allowed in storage account names. I set the sku to Standard_LRS (Locally Redundant Storage). All sku type names are case-sensitive.

az storage account create --name stsunshinedemo --resource-group rg-sunshine-demo --location westeurope --sku Standard_LRS

More info on storage account creation can be found on the Manage storage accounts documentation page.

Static website

Use the command below to update our storage blob service by enabling the static-website feature with --static-website true and define the index document with --index-document index.html.

az storage blob service-properties update --account-name stsunshinedemo --static-website true --index-document index.html


Next we need to have something to put in our storage. For this I created a super advanced website with..., no, just an index.html file like below in a directory called sunshine. It can be almost anything (html, css, js, media files, etc).

<!doctype html>

<html lang="en">
    <meta charset="utf-8">

    <p>I guess it must be Solar powered?</p>

Upload the directory contents with the following command. Here we use the directory ./sunshine as source and our storage container $web as destination.

az storage blob upload-batch --account-name stsunshinedemo --source ./sunshine --destination $web

To test our website we need to known the primary web endpoint. In simple words, we need the url of our website. This can be done by querying the az storage account as shown here.

az storage account show --name stsunshinedemo --query primaryEndpoints.web

The query returns something like "". Now open the primary web endpoint in your favorite browser. The website (index.html) is shown.

Content delivery network

Stay awake, we're halfway there. We need to deliver our content to the client. This is done by adding a content delivery network (CDN) profile to the Azure CDN. In that profile we add an endpoint with your custom-domain configured.


Create the CDN profile by using the command below where I use --sku Standard_Microsoft as my CDN provider.

az cdn profile create --name cdnp-sunshine-demo --resource-group rg-sunshine-demo --location westeurope --sku Standard_Microsoft


Next is the endpoint. As --origin and --origin-host-header we use the earlier queried primary web endpoint domain name as shown below. It's the domain name only, without the https:// prefix.

az cdn endpoint create --name cdne-sunshine-demo --resource-group rg-sunshine-demo --profile-name cdnp-sunshine-demo --origin --origin-host-header

Domain name registrar

It's time to let your domain name registrar known what domain name needs to point where.


We need the hostname of the CDN endpoint. Query the hostname with the az cdn endpoint show command.

az cdn endpoint show --name cdne-sunshine-demo --profile-name cdnp-sunshine-demo --resource-group rg-sunshine-demo --query hostName

The query returns something like "". Add a CNAME record for your domain at your domain name registrar. For this example I create a (sub-)domain called sunshine as shown in the image below.

Domain name registrar CNAME record


To connect your CDN endpoint to the custom hostname you've just created you need a DNS mapping. Do this by creating a custom-domain with a DNS mapping from the custom hostname to the CDN endpoint hostname.

az cdn custom-domain create --name cd-sunshine-demo --endpoint-name cdne-sunshine-demo --profile-name cdnp-sunshine-demo --hostname --resource-group rg-sunshine-demo --location westeurope


To enable secure communication between the client and our storage account you need to enable HTTPS. Use az cdn custom-domain enable-https with --min-tls-version 1.2 to support Transport Layer Security (TLS) version 1.2.

Use the command below to enable HTTPS. The command will finish in a few seconds. In the background it will complete much more tasks and can take a few hours to complete the whole process.

az cdn custom-domain enable-https --min-tls-version 1.2 --endpoint-name cdne-sunshine-demo --name cd-sunshine-demo --profile-name cdnp-sunshine-demo --resource-group rg-sunshine-demo

Redirect Http to Https

To complete everything there's one last task to take. We need to enforce the use of https to prevent http access. This can be done in the azure portal by adding a rule to the Rule engine. This can be found under the cdne-sunshine-demo endpoint settings by selecting the Rule engine option. The add the rule as shown below and don't forget to Save.

Enforce HTTPS

Now we have created a static website that is hosted in Azure and is accessible by a secure connection at your custom-domain address.