Detecção de Idioma Baseada em Edge Usando o Cabeçalho Accept-Language para Consistência de SEO

Sites que atendem públicos em múltiplos idiomas enfrentam uma tensão constante entre entregar a versão correta para visitantes humanos e fornecer uma estrutura previsível para os rastreadores dos motores de busca. A negociação de idioma tradicional do lado do servidor pode introduzir latência, acrescentar complexidade às camadas de cache e, às vezes, gerar URLs inconsistentes que confundem os bots de busca.

Implantar a detecção de idioma na borda — exatamente onde a requisição encontra pela primeira vez a rede de entrega de conteúdo (CDN) — oferece uma alternativa leve e de baixa latência. Ao ler o cabeçalho Accept‑Language (AL), uma função de edge pode decidir qual variante localizada servir, reescrever a URL da requisição ou rotear para um recurso pré‑gerado específico ao idioma. Quando feita corretamente, essa abordagem produz uma única URL canônica por idioma, anotações hreflang consistentes e respostas armazenáveis em cache que respeitam as políticas de TTL da CDN.

A seguir, acompanhamos os componentes essenciais de um pipeline de detecção de idioma baseado em edge, discutimos o design da chave de cache, exploramos mecanismos de fallback e delineamos etapas de implementação amigáveis ao SEO.

Por que Processar Idioma na Borda

Processar idioma na borda oferece três vantagens principais para SEO multilíngue:

1. Redução do Tempo de Ida e Volta – Locais de edge estão geograficamente mais próximos dos usuários finais, diminuindo a latência da etapa inicial de negociação.
2. Eficiência de Cache – Ao incorporar a decisão de idioma na chave de cache, o mesmo conteúdo pode ser armazenado uma vez por variante de idioma, evitando que o cabeçalho “Vary: Accept‑Language” faça a CDN ignorar o cache.
3. URLs Previsíveis – Reescritas na borda podem mapear uma requisição genérica (example.com) para um caminho específico de idioma (example.com/en/), preservando a estrutura estática de URLs que os motores de busca favorecem.

Esses benefícios se traduzem diretamente em melhores Core Web Vitals, menores taxas de rejeição e um sinal de rastreamento mais claro para os buscadores.

Anatomia de um Fluxo de Requisição na Borda

O diagrama Mermaid a seguir ilustra um fluxo típico do navegador do cliente até a função de edge, passando pela detecção de idioma e, finalmente, chegando ao servidor de origem ou à resposta em cache.

  flowchart TD
    A["Client Browser"] --> B["Edge Node (CDN)"]
    B --> C["Read Accept-Language Header"]
    C --> D{"Supported Language?"}
    D -- Yes --> E["Map to Language Path"]
    D -- No --> F["Apply Fallback Logic"]
    E --> G["Construct Cache Key (URL + Lang)"]
    F --> G
    G --> H{"Cache Hit?"}
    H -- Hit --> I["Serve Cached Variant"]
    H -- Miss --> J["Fetch From Origin"]
    J --> K["Store Variant in Cache"]
    K --> I
    I --> L["Response to Client"]

O diagrama enfatiza dois pontos de decisão: verificar se o idioma solicitado é suportado e lidar com acertos ou falhas de cache. Cada ramificação leva a uma URL determinística que os motores de busca podem indexar.

Projetando a Chave de Cache

Uma chave de cache bem elaborada é o ponto crucial de uma solução baseada em edge. A chave deve conter:

• O caminho da requisição normalizado (ex.: /products/123/).
• O código de idioma resolvido (ex.: en, fr, es).

Um formato típico de chave de cache se parece com /<language>/<path>. Por exemplo, uma requisição para /products/123/ com um cabeçalho AL indicando francês (fr) geraria a chave /fr/products/123/.

Evite usar o cabeçalho Vary para idioma, pois muitas CDNs tratam Vary: Accept-Language como um bypass de cache, efetivamente desativando o cache na borda. Ao incorporar o idioma diretamente na chave de cache, você preserva a capacidade da CDN de servir cópias armazenadas para cada variante de idioma.

Implementando a Função de Edge

Abaixo está um exemplo em pseudocódigo para um runtime genérico de edge (por exemplo, Cloudflare Workers, Fastly Compute@Edge ou AWS Lambda@Edge). A lógica é deliberadamente neutra em relação a linguagens e pode ser adaptada a qualquer runtime compatível com JavaScript.

export async function handle(event) {
  const request = event.request
  const url = new URL(request.url)

  // 1. Extrair cabeçalho Accept-Language
  const acceptLang = request.headers.get('Accept-Language') || ''
  
  // 2. Analisar cabeçalho em lista ordenada de tags de idioma
  const languages = parseAcceptLanguage(acceptLang)

  // 3. Determinar o primeiro idioma suportado
  const