Como configurar Azure Blob Static Website: passo a passo

João Barros 04 de October de 2026 5 min de leitura

Este tutorial mostra como publicar um site estático simples usando Azure Blob Storage Static Website. É uma solução leve e económica para hospedar landing pages, single-page apps (SPA) ou documentação técnica sem precisar de uma Web App, servidor ou CDN complexa. Aqui explico o porquê de cada passo e dou comandos práticos para teres o site online em poucos minutos.

Pré-requisitos

Conta Azure com permissões para criar recursos (Subscription Contributor ou superior).
Azure CLI instalada e autenticada (az login).
Um pequeno site estático local — tipicamente pelo menos index.html e 404.html; por exemplo um directório ./site com 5–20 ficheiros (HTML, CSS, JS, imagens).
Opcional: Azure Storage Explorer para inspecionar visualmente o contentor $web.

Porque isto é útil: Azure Blob Static Website serve ficheiros directamente a partir de um contentor especial ($web). Não há servidores a correr, o serviço escala automaticamente com o tráfego e o custo é principalmente armazenamento + egress. Para um site estático simples, pode-se ficar com custos de poucos cêntimos por mês em baixo tráfego.

Passo 1: Criar uma Storage Account

Criamos uma Storage Account do tipo StorageV2 (general-purpose v2) com replicação Standard_LRS. O nome da Storage Account tem de ser único globalmente e apenas caracteres alfanuméricos minúsculos.

az group create --name rg-staticweb --location northeurope
az storage account create --name mystaticacct12345 --resource-group rg-staticweb --location northeurope --sku Standard_LRS --kind StorageV2

Notas práticas: escolhe northeurope se estiveres na Europa para latências mais baixas. Standard_LRS é uma boa escolha inicial (custo reduzido); se precisares de maior resiliência podes usar GRS/RA-GRS. Um exemplo real: uma pequena landing page com 1 MB de conteúdo distribuído por 20 ficheiros costuma ter custos de armazenamento inferiores a 0,10 €/mês, mais o custo de egress conforme visitas.

Passo 2: Habilitar Static Website na Storage Account

Ativa a funcionalidade static website e define os documentos de index e 404. Isto diz ao serviço para mapear pedidos à raiz para index.html e gerir erros com 404.html.

az storage account update --name mystaticacct12345 --resource-group rg-staticweb --set allowBlobPublicAccess=true

# Ativar static website e definir ficheiros padrão
az storage blob service-properties update --account-name mystaticacct12345 --static-website --index-document index.html --404-document 404.html

Explicação: allowBlobPublicAccess=true permite servir directamente os blobs publicamente; se preferires restrição, usa um SAS ou uma CDN com origin privada. Depois de ativar, o Azure cria automaticamente o contentor $web.

Passo 3: Fazer upload dos ficheiros do site

Carrega os ficheiros do teu directório local para o contentor $web. O exemplo usa a connection string, mas podes usar um SAS token ou SharedKey.

CONN=$(az storage account show-connection-string --name mystaticacct12345 --resource-group rg-staticweb -o tsv)

# Carregar todos os ficheiros do directório ./site
az storage blob upload-batch --connection-string "$CONN" --destination '$web' --source ./site

# Verificar que os blobs foram carregados
az storage blob list --connection-string "$CONN" --container-name '$web' -o table

Exemplo prático: se tens 12 ficheiros, o comando upload-batch vai enviá-los em paralelo. Se um ficheiro falhar por problemas de rede, repete o upload do ficheiro em questão.

Passo 4: Configurar MIME types e caching (opcional)

Para garantir que navegadores interpretam correctamente CSS e JS e para optimizar performance, define Content-Type e Cache-Control. Um exemplo comum é definir um cache longo para ficheiros estáticos versionados (hash no nome) e cache curto para index.html.

az storage blob upload --connection-string "$CONN" --container-name '$web' --file ./site/styles.css --name styles.css --content-type 'text/css' --content-cache-control 'public, max-age=31536000'

# Para o index.html (cache curto)
az storage blob upload --connection-string "$CONN" --container-name '$web' --file ./site/index.html --name index.html --content-type 'text/html' --content-cache-control 'no-cache, must-revalidate'

Regra prática: usa max-age=31536000 (1 ano) para assets estáveis e no-cache para ficheiros que podem mudar sem mudar o nome.

Passo 5: Obter a URL pública e configurar domínio personalizado (opcional)

Obtém o endpoint público criado e testa o site. Se quiseres domínio personalizado com HTTPS, considera usar Azure CDN ou Azure Front Door porque o endpoint static website não suporta directamente TLS para domínios personalizados.

az storage account show --name mystaticacct12345 --resource-group rg-staticweb --query "primaryEndpoints.web" -o tsv
# Exemplo de output: https://mystaticacct12345.z6.web.core.windows.net/

Para domínios personalizados: cria um registo CNAME para apontar para o endpoint e valida o domínio. Para HTTPS automático e melhores caches, implementa Azure CDN ou Front Door (pode custar desde alguns euros/mês dependendo do tráfego).

Verificar o resultado

Acede à URL do endpoint; deverás ver o conteúdo de index.html. Testa uma rota inexistente e confirma que aparece 404.html. Se não encontrares ficheiros, verifica se eles estão no contentor $web com az storage blob list e confirma Content-Type. Erro comum: 403 Forbidden — isso indica que allowBlobPublicAccess está desativado ou usaste credenciais inválidas; solução: ativa a opção ou usa um SAS válido.

Conclusão

Agora tens um site estático a correr em Azure Blob Static Website. É rápido de configurar e muito adequado para projetos simples. Próximos passos sugeridos: automatiza deploy com GitHub Actions (fazer build e executar os mesmos comandos CLI), adiciona domínio personalizado com Azure CDN para HTTPS, ou define políticas de cache finas para reduzir latência. Dica final: sempre confirma que os ficheiros estão no contentor '$web' e que os Content-Type estão corretos para evitar problemas de renderização no navegador.