Hosting Static Websites in Azure Blob Storage with Azure Functions Proxies

In serverless architectures, it’s common to build your website as a SPA, meaning that you only need static website hosting. A common choice for this is Amazon S3, but if you have an Azure subscription, you may be wondering if you can use Azure Blob Storage instead.

Well, if you create a Blob Storage Account, and make a container and set it’s blobs to be publicly accessible, then you can navigate to your site by visiting a URL like: https://mystorageaccount.blob.core.windows.net/mycontainer/index.html

And this works just fine, but there are a few key limitations you need to be aware of.

First of all, although you can point a custom domain at an Azure Blob Storage account, you can’t upload your own SSL certificate. This is the top requested feature for Azure Blob Storage, and Microsoft’s response indicates they do intend to resolve this as a high priority.

Second of all, we’d rather not need to specify index.html explicitly, but Azure Blob storage doesn’t have default document support. This is another highly requested feature and so hopefully Microsoft will also address this soon, along with removing the need to specify the container name in the URL.

And there are a few other features that are desirable for a static website host, such as the ability to serve a custom 404 page.

So in its current state, Azure Blob Storage isn’t ideal for hosting a static website.

Fortunately, there is now a workaround available in the shape of Azure Functions proxies. What you can do is create an Function App and give it a proxy that passes on requests to Blob Storage.

Let’s see how to do that. In our function app, because it’s still in preview, we need to explicitly enable proxies:

And I’ll create two proxies. The first, will redirect the base URL to the index.html in my static hosting blob container:

And the second will forward every additional request for any other path directly to the blob container. That’s achieved with the special {*restOfPath} syntax which matches any path.

With that in place, I now can directly access my static website by visiting the URL of the function app.

What’s more, Azure Function apps support custom domains, so I can go in and configure some domain name I own to point at the function app.

Azure Function Apps also allow you to upload SSL certificates, so as well as solving the default document issue, and removing the need for the container name in the path, this also is a way to use HTTPS on custom domains. So with Azure Functions proxies you can work around most of the major limitations of static hosting on Azure Blob Storage.

Obviously you will pay for a function execution for each file that’s requested, but remember that you get 1 million free function executions a month, so you may not end up paying anything for most websites.