Marcio Cunha

Proteção CSRF: Integração entre Next.js e Backends PHP

Aprenda como implementar mecanismos robustos de proteção contra ataques CSRF ao conectar um frontend Next.js a uma API em PHP. Descubra como gerenciar tokens de sincronização de forma segura.

Marcio Cunha2 min
Também disponível em:EnglishEspañol
Resumo
  • O ataque CSRF explora a confiança do navegador em cookies de sessão para executar ações não autorizadas em nome do usuário.
  • A estratégia mais eficaz para APIs externas é o uso de tokens anti-CSRF ou o cabeçalho personalizado X-XSRF-TOKEN.
  • O Next.js deve realizar uma requisição inicial de handshake para obter o token CSRF antes de enviar formulários de escrita.
  • O backend em PHP precisa validar a presença e a integridade do token antes de processar qualquer requisição que altere o estado do sistema.
  • O uso do atributo SameSite=Lax ou Strict nos cookies de sessão do PHP oferece uma camada adicional de defesa nativa pelo navegador.

O desafio da segurança entre domínios distintos

Ao construir uma arquitetura onde o frontend Next.js roda em um servidor e o backend em PHP em outro, a segurança de formulários se torna um ponto crítico. O CSRF, ou Cross-Site Request Forgery, é um ataque onde um site malicioso força o navegador do usuário a realizar uma ação indesejada em outra aplicação onde ele está logado. Como o navegador envia automaticamente os cookies de sessão para o domínio do PHP, o backend pode acreditar que a requisição partiu do usuário legítimo.

A lógica por trás do token anti-CSRF

Para mitigar esse risco, utilizamos o padrão de Token de Sincronização. O conceito é simples: o backend PHP gera um identificador único, longo e aleatório para cada sessão, que deve ser enviado em toda requisição de escrita, como POST, PUT ou DELETE. Como o atacante não consegue ler o conteúdo da resposta do seu backend devido às políticas de CORS, ele não tem acesso a esse token secreto.

Implementando o fluxo no Next.js

No Next.js, o fluxo envolve buscar o token antes do envio do formulário. Você pode criar um endpoint no PHP (ou expor uma meta-tag) que entregue esse token para o frontend. A partir daí, o frontend armazena esse valor, por exemplo, em um estado ou no sessionStorage. Em cada requisição feita via Fetch API ou Axios, o token deve ser incluído em um cabeçalho customizado como 'X-XSRF-TOKEN'.

Configuração do Backend PHP

O lado do PHP deve ser configurado para validar este cabeçalho. Em um framework como Laravel, isso é nativo via middleware, mas em PHP puro, você precisa checar se o cabeçalho existe e se ele corresponde ao valor gravado na sessão. Se o token for inválido ou ausente, o servidor deve retornar um erro HTTP 403 Forbidden, impedindo a execução de qualquer lógica de negócio sensível.

Considerações sobre Cookies e SameSite

Além dos tokens, configurar o atributo 'SameSite' nos cookies de sessão do PHP é vital. Ao definir 'SameSite=Lax', você instrui o navegador a não enviar cookies em requisições cross-site iniciadas por terceiros. Essa é uma defesa de primeira linha. No entanto, em arquiteturas onde frontend e backend operam em subdomínios diferentes, o ajuste preciso dessas configurações é o que garantirá a estabilidade e a segurança da sua aplicação de ponta a ponta.