Forem

Lithe
Lithe

Posted on

1 1

Protegendo sua Aplicação com CSRF no Lithe

Neste tutorial, vamos aprender a implementar proteção CSRF (Cross-Site Request Forgery) no Lithe, para evitar que requisições indesejadas sejam feitas na sua aplicação. Este guia é pensado para iniciantes, então vamos por partes!


O que é CSRF?

CSRF, ou Cross-Site Request Forgery, é um tipo de ataque onde um usuário é enganado para executar uma ação não autorizada em um site no qual está autenticado. Esse ataque é perigoso pois o invasor pode manipular dados ou acessar áreas restritas. Para evitar isso, adicionamos uma camada de segurança que impede que requisições suspeitas sejam processadas.


Estrutura do Tutorial

  1. Configurar o Lithe
  2. Instalar o Middleware CSRF
  3. Adicionar o Token CSRF no Backend
  4. Verificar o Token no Backend
  5. Enviar o Token pelo Frontend
  6. Testar a Proteção CSRF

Vamos começar!


Passo 1: Configurando o Lithe

Se você ainda não tem o Lithe configurado, comece instalando o framework com o comando abaixo:

composer create-project lithephp/lithephp nome-do-projeto
cd nome-do-projeto
Enter fullscreen mode Exit fullscreen mode

Isso cria uma estrutura básica para o seu projeto com Lithe.


Passo 2: Instalando o Middleware CSRF

O middleware CSRF ajuda a gerar e validar tokens CSRF. Para instalar, execute o seguinte comando no terminal dentro do seu projeto:

composer require lithemod/csrf
Enter fullscreen mode Exit fullscreen mode

Passo 3: Configurando o Middleware CSRF

Agora, precisamos dizer ao Lithe que queremos usar o middleware CSRF. Abra o arquivo principal src/App.php e adicione o middleware CSRF.

use Lithe\Middleware\Security\csrf;
use function Lithe\Orbis\Http\Router\router;

$app = new \Lithe\App;

// Configura o middleware CSRF com verificação automática no corpo da requisição
$app->use(csrf([
    'expire' => 600, // Expiração do token após 10 minutos
    'checkBody' => true, // Habilita a verificação automática no corpo
    'bodyMethods' => ['POST', 'PUT', 'DELETE'], // Define os métodos para verificar o CSRF no corpo
]));

$app->use(router(__DIR__ . '/routes/web'));

$app->listen();
Enter fullscreen mode Exit fullscreen mode

Com isso, o middleware CSRF está ativo em nossa aplicação, e toda requisição que precise de proteção deverá incluir um token válido.


Passo 4: Gerando o Token CSRF

Para usar a proteção CSRF, precisamos gerar um token único e incluí-lo nas requisições. Vamos criar uma rota para enviar um formulário que inclui automaticamente o token CSRF.

  1. Crie um arquivo chamado src/routes/web.php, e adicione a rota do formulário com um campo para o token CSRF.
use Lithe\Http\{Request, Response};
use function Lithe\Orbis\Http\Router\get;

get('/form', function (Request $req, Response $res) {
    // Gera o campo de token CSRF
    $tokenField = $req->csrf->getTokenField();

    // Envia o HTML com o token incluído no formulário
    return $res->send("
        <form method='POST' action='/submit'>
            $tokenField
            <input type='text' name='data' placeholder='Digite algo' required>
            <button type='submit'>Enviar</button>
        </form>
    ");
});
Enter fullscreen mode Exit fullscreen mode
  1. Essa rota cria um formulário que inclui o campo do token CSRF. O campo é obrigatório para que o Lithe verifique a autenticidade da requisição.

Passo 5: Verificando o Token no Backend

Quando o formulário for enviado, o Lithe verificará automaticamente se o token é válido. Agora, vamos criar a rota que vai receber e processar o formulário.

  1. No mesmo arquivo src/routes/web.php, adicione a rota para processar o envio do formulário.
use function Lithe\Orbis\Http\Router\post;

post('/submit', function (Request $req, Response $res) {
    // O Lithe verifica automaticamente o token, então só precisamos processar os dados
    $data = $req->input('data');
    return $res->json([
        'message' => 'Dados recebidos com sucesso!',
        'data' => $data,
    ]);
});
Enter fullscreen mode Exit fullscreen mode

Se o token for inválido ou estiver ausente, o Lithe automaticamente bloqueará a requisição e retornará um erro.


Passo 6: Enviando Requisições com o Token CSRF

No frontend, sempre que precisar enviar uma requisição POST (ou outro método de alteração de dados), é importante incluir o token CSRF no corpo da requisição ou no cabeçalho, dependendo de como configurou seu middleware.

Exemplo com JavaScript Fetch API

Para quem usa JavaScript, aqui está um exemplo de como enviar o token com uma requisição fetch:

fetch('/submit', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    },
    body: '_token=' + document.querySelector('input[name="_token"]').value + '&data=exemplo'
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Erro:', error));
Enter fullscreen mode Exit fullscreen mode

Passo 7: Testando a Proteção CSRF

  1. Acesse a rota /form no navegador. Você verá o formulário com o token CSRF incluído.
  2. Preencha o campo e envie o formulário.
  3. Se tudo estiver funcionando, você verá uma mensagem de sucesso com os dados enviados.

Resumo e Considerações Finais

Neste tutorial, aprendemos:

  • O que é e por que o CSRF é importante.
  • Como configurar um middleware CSRF no Lithe.
  • Como gerar e verificar tokens CSRF no backend.
  • Como enviar tokens CSRF com formulários e requisições AJAX.

Com essa proteção implementada, você torna sua aplicação mais segura contra ataques CSRF, ajudando a proteger a integridade dos dados dos seus usuários.

Para informações mais detalhadas, confira a Documentação Oficial do Lithe.

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more →

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay