Implementando Cabeçalhos HTTP Seguros com Cloudflare Workers: Um Guia Detalhado
Este artigo apresenta um método passo a passo para configurar cabeçalhos HTTP de segurança em sites que utilizam a plataforma Cloudflare, através dos Cloudflare Workers. Essa prática, recomendada por OWASP, é fundamental para proteger seu site contra ameaças comuns, como ataques XSS, Clickjacking e injeção de código.
Já abordamos anteriormente a implementação de cabeçalhos em servidores web tradicionais como Apache, Nginx e IIS. No entanto, se você usa o Cloudflare para proteger e otimizar seu site, os Cloudflare Workers oferecem uma solução prática para gerenciar os cabeçalhos de resposta HTTP.
Cloudflare Workers é uma plataforma serverless, onde você pode executar códigos em JavaScript, C, C++ e Rust. O código é executado em todos os datacenters da Cloudflare, espalhados em mais de 200 locais globalmente.
A implementação é simples e flexível, permitindo aplicar os cabeçalhos em todo o site, incluindo subdomínios e URIs específicos, usando correspondência de padrões via Regex.
Para este guia, utilizaremos o código desenvolvido por Scott Helme.
Vamos começar! 👨💻
- Acesse o Cloudflare e clique em “Workers” (link direto).
- Copie o conteúdo do arquivo
worker.jsdo GitHub e cole no editor de scripts.
const securityHeaders = {
"Content-Security-Policy": "upgrade-insecure-requests",
"Strict-Transport-Security": "max-age=1000",
"X-Xss-Protection": "1; mode=block",
"X-Frame-Options": "DENY",
"X-Content-Type-Options": "nosniff",
"Referrer-Policy": "strict-origin-when-cross-origin"
},
sanitiseHeaders = {
Server: ""
},
removeHeaders = [
"Public-Key-Pins",
"X-Powered-By",
"X-AspNet-Version"
];
async function addHeaders(req) {
const response = await fetch(req),
newHeaders = new Headers(response.headers),
setHeaders = Object.assign({}, securityHeaders, sanitiseHeaders);
if (newHeaders.has("Content-Type") && !newHeaders.get("Content-Type").includes("text/html")) {
return new Response(response.body, {
status: response.status,
statusText: response.statusText,
headers: newHeaders
});
}
Object.keys(setHeaders).forEach(name => newHeaders.set(name, setHeaders[name]));
removeHeaders.forEach(name => newHeaders.delete(name));
return new Response(response.body, {
status: response.status,
statusText: response.statusText,
headers: newHeaders
});
}
addEventListener("fetch", event => event.respondWith(addHeaders(event.request)));
Não salve ainda. Antes, ajuste os cabeçalhos conforme as necessidades do seu projeto.
Content-Security-Policy: Se você precisa definir uma política de segurança específica, este é o local.
Por exemplo, para permitir a exibição de conteúdo em iFrames a partir de domínios específicos, use o atributo “frame-ancestors”:
"Content-Security-Policy" : "frame-ancestors 'self' gf.dev etechpt.com.com",
O exemplo acima permite carregar o conteúdo dos domínios gf.dev, etechpt.com.com e do próprio site.
X-Frame-Options: Altere para “SAMEORIGIN” se seu site precisa ser exibido em iframes no mesmo domínio.
"X-Frame-Options": "SAMEORIGIN",
Server: Modifique o cabeçalho do servidor para informações personalizadas.
"Server" : "etechpt.com Server",
RemoveHeaders: Aqui você define quais cabeçalhos serão removidos para evitar a divulgação de informações.
let removeHeaders = [ "Public-Key-Pins", "X-Powered-By", "X-AspNet-Version", ]
Adicionando Novos Cabeçalhos: Para incluir cabeçalhos personalizados, utilize a seção securityHeaders:
let securityHeaders = {
"Content-Security-Policy" : "frame-ancestors 'self' gf.dev etechpt.com.com",
"Strict-Transport-Security" : "max-age=1000",
"X-Xss-Protection" : "1; mode=block",
"X-Frame-Options" : "SAMEORIGIN",
"X-Content-Type-Options" : "nosniff",
"Referrer-Policy" : "strict-origin-when-cross-origin",
"Custom-Header" : "Success",
}
Após ajustar todos os cabeçalhos, nomeie o worker e clique em “Salvar e Implantar”.
O worker está pronto! Agora, associe-o ao seu site:
- Acesse o painel do Cloudflare e selecione seu site.
- Vá para a aba “Workers” e clique em “Adicionar Rota”.
- Defina a URL da Rota, usando Regex se necessário.
- Selecione o worker recém-criado e salve.
Em instantes, os cabeçalhos serão aplicados no seu site.
Veja como aparece no Chrome Dev Tools. Você também pode testar usando ferramentas HTTP de análise de cabeçalhos.
Note que o cabeçalho do servidor não é refletido, provavelmente substituído pelo Cloudflare.
A implementação é rápida, levando cerca de 15 minutos, sem necessidade de downtime ou reinicialização. Ao aplicar em produção, faça testes em ambientes de homologação ou em rotas específicas antes.
Isso é fantástico!
Agradecimentos a Scott pelo código.