Como alojar um site estático na Amazon S3

Como alojar um site estático na Amazon S3

Esta semana desenvolvi um pequeno site estático (baseado apenas em HTML/CSS/Javascript) e, na altura de o publicar, optei por alojá-lo no popular Amazon Simple Storage Service (S3).

As razões para tal são simples: neste serviço da Amazon, só pagas o que efetivamente gastas, a nível de tráfego - e o valor por GB transferido? $0.03!

Mesmo com outros serviços de alojamento competitivos, dificilmente encontrarás melhor negócio do que este, especialmente se se tratar de um site estático leve, como era o caso.

Para além disso, se fores novo a utilizar os Amazon Web Services, ainda poderás desfrutar de um plano gratuito durante 12 meses, que te permitirá ficar a conhecer as poderosas ferramentas disponíveis.

Mas se chegaste até aqui, provavelmente já sabes que este é o serviço certo para ti - falta só saber como o configurar, certo?

Vamos a isto!

NOTA: Os primeiros passos já foram referidos noutro tutorial, que se encontra neste link. Ainda assim, vou-te poupar um clique e descrevê-los novamente aqui.

Passo #1: Criar um bucket com o nome do domínio que pretendes

Depois de fazeres o registo/login na AWS, é tempo de escolher o serviço S3, que encontrarás em Storage & Content Delivery.

Amazon S3 da Amazon Web Services

Uma vez dentro do S3, deverás criar um bucket, que é no fundo a “pasta” onde colocarás todos os ficheiros do teu site.

Este é um ecrã importantíssimo, por um simples motivo: o nome do bucket deve ser igual ao domínio que pretendes utilizar. Portanto se queres que o teu site seja www.omeusite.pt, o teu bucket deve-se chamar www.omeusite.pt.

Relativamente à região, se o teu site é essencialmente para Portugal, deverás escolher Irlanda ou Frankfurt, para que a proximidade (e consequentemente a velocidade de acesso) seja maior.

Se se tratar de um site internacional, pensa nos teus visitantes e não propriamente onde estás localizado (o preço do serviço é sensivelmente diferente, dependendo da região que escolheres).

Amazon S3 - Create a Bucket

Podes ignorar o botão Set Up Logging e avançar.

Passo #2: Alterar as permissões

Agora que já criaste o teu bucket, deves selecioná-lo e clicar em Actions/Properties.

Amazon S3 - Bucket Properties

Em Permissions, deves clicar em Edit bucket policy e inserir este excerto:

{
	"Version": "2012-10-17",
	"Statement": [
		{
			"Sid": "AddPerm",
			"Effect": "Allow",
			"Principal": "*",
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::examplebucket/*"
		}
	]
}

Alterando depois examplebucket para o nome do teu próprio bucket (o tal www.omeusite.pt, seguindo o exemplo de cima).

Em Static Website Hosting, deves clicar em Enable website hosting e definir como index document o habitual index.html.

Amazon S3 - Static Website Hosting

Agora, se clicares no link que está em Endpoint (que deverá ser algo como www.omeusite.pt.s3-website-eu-west–1.amazonaws.com) verás que o teu site já está live!

O tutorial poderia terminar aqui, mas vamos associar o nosso domínio a este alojamento.

Passo #3: Associar um domínio à Amazon S3

Os próximos passos terão em conta o serviço Cloudflare, um serviço fantástico e na sua grande maioria gratuito que, na minha opinião, todos os sites deveriam considerar.

Entre muitas outras coisas, como velocidade ou segurança, o Cloudflare permite-te configurar todos os domínios num só local - tornando-se muito mais prático na altura de migrações do que teres de aceder a cada domain registrar para alterar os nameservers do teu site.

Assim sendo, o primeiro passo depois do registo/login será ir a Add Site. Aqui, deves inserir o teu domínio, como omeusite.pt.

Cloudflare - Add a Website

O Cloudflare fará o seu trabalho e depois de terminar o scan, indicará novos nameservers para colocares no teu domínio. Aqui, deves ir ao site da empresa onde adquiriste o domínio e alterar os nameservers para aqueles indicados pelo Cloudflare.

Cloudflare - Nameservers

Deverão ser algo deste género (atenção ao “.” no final):

  • matt.ns.cloudflare.com.
  • lola.ns.cloudflare.com.

NOTA: se tiveres adquirido um domínio .PT e o mesmo estiver no estado TECH-PRO, em vez de ACTIVE, não conseguirás utilizar o Cloudflare de imediato. Primeiro, terás que o associar a outro alojamento, para que o estado altere para ACTIVE, e só aí poderás colocar os nameservers do Cloudflare.

É possível que esta alteração leve algum tempo até ficar finalizada - podes ir confirmando no teu terminal, se escreveres whois omeusite.pt e procurando por Nameserver Information.

Agora que já tens o domínio associado ao Cloudflare, falta a outra parte da equação: ligar o Cloudflare ao Amazon S3.

No painel de controlo do Cloudflare, deverás ir a DNS e criar um CNAME onde o Name deverá ser www e o Domain Name o tal endereço que viste anteriormente do teu site, similar a www.omeusite.pt.s3-website-eu-west–1.amazonaws.com.

Cloudflare - DNS

Agora sim, quem aceder a www.omeusite.pt conseguirá ver o site como o concebeste - mas ainda há um problema; quem escrever http://omeusite.pt (sem www) terá uma mensagem de erro e não conseguirá visualizar o teu site!

Para resolver este problema, falta um passo adicional - criar uma regra para que haja um redirect para o endereço com www.

No Cloudflare vai até Page Rules e na caixa Add new rule faz o seguinte:

  • No URL Pattern, insere o URL como http://omeusite.pt/* (não te esqueças do “*”, que adicionará o redirecionamento automático para todas as outras páginas do site);
  • Ativa o Forwarding, passando-o para On;
  • Em Forwarding, escreve http://www.omeusite.pt;
  • No Forwarding Type, opta pelo Permanent - 301.

Cloudflare - Page Rules

E agora sim, está feito! Quem disse que alojar um site tem que ser dispendioso?

Tempo de leitura: 5 min

O que procuras?

As sugestões aparecem a partir de 3 caracteres. Usa as setas para as percorrer.

Formulário de Contacto

Envia-me um e-mail para [email protected] ou preenche o formulário.

Campos obrigatórios