You can enable Azure Content Delivery Network (CDN) to cache content from a static website that is hosted in an Azure storage account. You can use Azure CDN to configure the custom domain endpoint for your static website, provision custom TLS/SSL certificates, and configure custom rewrite rules. Configuring Azure CDN results in additional charges, but provides consistent low latencies to your website from anywhere in the world. Azure CDN also provides TLS encryption with your own certificate.
The first step to creating your Static Website on a CDN, is to create a Storage Account where your static assets will be hosted.
Create a Static Website
Next, is to configure your Static Website. You can set this up within the menu of the Storage Account, as per below:
From here you can upload your files and define your index and error documents, e.g. index.html.
Notice the $web container is automatically referenced in this screen and created in the Storage Account. This is the location where you should upload your static assets with the index and error documents you have already defined:
Using the URL for the Static website, you should be able to see the site load:
In order to provide low-latency global access to your site, the next step is to setup your CDN.
Create a CDN Endpoint
When creating a CDN endpoint there are three options available:
- For Azure CDN Standard from Microsoft profiles, propagation usually completes in 10 minutes.
- For Azure CDN Standard from Akamai profiles, propagation usually completes within one minute.
- For Azure CDN Standard from Verizon and Azure CDN Premium from Verizon profiles, propagation usually completes within 90 minutes.
Note the propagation times, particularly for Verizon!
For this example, i’m going to create a CDN Standard from Microsoft:
Linking CDN to the Static Website
What follows is the configuration of the CDN to cache the content from the static website. This is completed under the Origin tab of the CDN. The Origin hostname and the Origin host header are stipulated with the endpoint for the Static Website, which we created earlier:
In order to use your site in your Production environment, you will want to create a CNAME record, in your DNS zone, which points to the endpoint for your CDN:
Custom Hostname -> CDN Endpoint -> Azure Static Website Endpoint -> Static Assets in Blob
You can add Custom Hostnames from within the Custom Domains section of the CDN menu. The only prerequisite here is that you have the CNAME record, as mentioned above, created before attempting to establish the Custom Domain.
For more information:
- CDN Overview: https://docs.microsoft.com/en-us/azure/cdn/cdn-overview
- Compare CDN Product features: https://docs.microsoft.com/en-us/azure/cdn/cdn-features
- Azure CDN global coverage: https://docs.microsoft.com/en-us/azure/cdn/cdn-pop-locations