DEV Community: Yago Costa Ayala

Easy on Humans, Hard on Bots

Yago Costa Ayala — Sat, 27 Jul 2024 21:13:17 +0000

Have you ever been frustrated by trying to prove you're not a robot? Google's reCAPTCHA is here to help, and it has evolved significantly over the years to make this process smoother and more secure. Let's explore the different types of reCAPTCHA, their functionalities, reasons for discontinuing older versions, and what makes each one unique.

reCAPTCHA v1

Introduced in 2007, reCAPTCHA v1 featured two distorted texts that you had to transcribe correctly. One word was known and verified you were human, while the other helped digitize old books.

By March 2018, advanced bots could easily bypass this system, and improved text recognition techniques made it less relevant. So, it was time to say goodbye.

reCAPTCHA v2

Released in December 2014, reCAPTCHA v2 upped its game. You've probably seen the "I'm not a robot" checkbox. When you click it, the system analyzes your behavior before and after. If it's unsure, it presents an image challenge where you select pictures matching a prompt.

reCAPTCHA v2 is faster and less frustrating. It's designed to be more user-friendly while still keeping those pesky bots at bay.

reCAPTCHA v3

Launched in October 2018, reCAPTCHA v3 takes a more subtle approach. Instead of interrupting users with challenges, it assigns a score (0.0 to 1.0) based on your interactions with the site. This score helps site administrators determine if you’re a human or a bot without interrupting your experience.

No more puzzles! reCAPTCHA v3 works silently in the background, giving you a seamless browsing experience while still protecting the site.

reCAPTCHA Enterprise

Tailored for businesses, reCAPTCHA Enterprise offers advanced protection against bots and fraud. It integrates deeply with a company’s security infrastructure and allows for robust customizations.

It includes sophisticated threat detection and advanced configuration options, making it perfect for large-scale enterprise needs.

Comparing reCAPTCHA v2 and v3

Advanced Algorithms: reCAPTCHA v3 uses sophisticated machine learning algorithms to analyze user behavior, providing a more accurate assessment of whether a user is legitimate or a bot.
Continuous Monitoring: Unlike reCAPTCHA v2, which relies on single-point interactions (like clicking a checkbox or solving an image puzzle), reCAPTCHA v3 continuously monitors user interactions across the site, leading to more precise detection of bots.
Non-Intrusive: Since it operates in the background without interrupting the user experience, it can gather more behavioral data, which improves the accuracy of its assessments.

In conclusion, reCAPTCHA v3 offers better performance and results in distinguishing legitimate users from bots due to its continuous monitoring and advanced machine learning capabilities.

How reCAPTCHA Works

Ever wondered what happens behind the scenes? Here's a quick rundown:

Action Initiated: You perform an action that triggers reCAPTCHA.
JavaScript Loaded: Your browser loads the necessary JavaScript.
Signals Sent: The JavaScript collects interaction signals and sends them to Google’s servers.
Token Generated: Google analyzes the signals and returns an encrypted token.
Token Validated: The site validates the token with Google.
Decision Made: Based on the validation, the system determines if you’re human or a bot.

How to Implement reCAPTCHA v3 Using React and Node.js

Here's a very simple example of how to implement reCAPTCHA v3 in a React application with a Node.js backend.

Frontend (React)

Install the react-google-recaptcha-v3 package:

   npm install react-google-recaptcha-v3

Create a simple React component with reCAPTCHA v3

   // App.js
   import React, { useState } from 'react';
   import { GoogleReCaptchaProvider, useGoogleReCaptcha } from 'react-google-recaptcha-v3';

   function App() {
     const { executeRecaptcha } = useGoogleReCaptcha();
     const [token, setToken] = useState('');

     const handleSubmit = async () => {
       if (!executeRecaptcha) {
         return;
       }

       const token = await executeRecaptcha('submit');
       setToken(token);

       await fetch('http://localhost:5000/verify-captcha', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',
         },
         body: JSON.stringify({ token }),
       });
     };

     return (
       <GoogleReCaptchaProvider reCaptchaKey="YOUR_RECAPTCHA_SITE_KEY">
         <div>
           <button onClick={handleSubmit}>Submit</button>
         </div>
       </GoogleReCaptchaProvider>
     );
   }

   export default App;

Backend (Node.js)

Install express and body-parser packages

   npm install express body-parser

Create a simple Express server to verify the reCAPTCHA token

   // server.js
   const express = require('express');
   const bodyParser = require('body-parser');
   const fetch = require('node-fetch');

   const app = express();
   const PORT = 5000;

   app.use(bodyParser.json());

   app.post('/verify-captcha', async (req, res) => {
     const { token } = req.body;
     const secretKey = 'YOUR_RECAPTCHA_SECRET_KEY';

     const response = await fetch(`https://www.google.com/recaptcha/api/siteverify`, {
       method: 'POST',
       headers: {
         'Content-Type': 'application/x-www-form-urlencoded',
       },
       body: `secret=${secretKey}&response=${token}`,
     });

     const data = await response.json();
     if (data.success) {
       res.json({ success: true, message: 'Human verified' });
     } else {
       res.json({ success: false, message: 'Verification failed' });
     }
   });

   app.listen(PORT, () => {
     console.log(`Server running on http://localhost:${PORT}`);
   });

Replace YOUR_RECAPTCHA_SITE_KEY and YOUR_RECAPTCHA_SECRET_KEY with your actual reCAPTCHA site key and secret key, respectively.

Conclusion

reCAPTCHA has come a long way in making the web safer and user-friendly. From deciphering texts to seamless, invisible checks, each version improves on the last. Choosing the right version depends on your site’s needs and the level of security you desire.

References

I hope you enjoyed this journey through the evolution of reCAPTCHA!

Entendendo porque o Cache Lock é sinônimo de integridade

Yago Costa Ayala — Sat, 20 Jul 2024 14:06:21 +0000

Se você trabalha com sistemas de computação, sabe que lidar com uma enxurrada de requisições e operações concorrentes é um desafio diário. Garantir que seus dados permaneçam íntegros e que suas operações sejam eficientes é uma tarefa e tanto. E aí entra uma técnica que pode ser a solução para muitos dos problemas que você enfrenta: o cache lock.

Mas o que é Cache Lock?

Imagine que você está em um buffet, onde todos querem pegar comida ao mesmo tempo. Sem organização, seria um caos, certo? O cache lock é como um organizador que deixa uma pessoa pegar comida de cada vez, evitando o tumulto. Basicamente, ele sincroniza o acesso a recursos compartilhados em um sistema de cache, garantindo que apenas uma operação possa ser executada por vez em um recurso específico. Isso previne que várias operações concorrentes causem inconsistências ou sobrecarreguem o sistema.

E como Funciona?

Vamos desmistificar o funcionamento do cache lock:

Aquisição do Lock: Quando uma operação crítica é iniciada, ela tenta adquirir um lock (bloqueio). Esse lock é um sinalizador que indica que o recurso está em uso. Imagine que você coloca um "não perturbe" na porta de um quarto.
Execução da Operação: Com o lock adquirido, a operação é executada sem interrupções. Durante esse tempo, outras operações que tentem acessar o mesmo recurso são bloqueadas ou colocadas em fila de espera.
Liberação do Lock: Após a conclusão da operação, o lock é liberado, permitindo que outras operações possam acessar o recurso. É como retirar o "não perturbe" da porta, liberando o quarto para a próxima pessoa.

Esse ciclo simples de aquisição, execução e liberação garante que apenas uma operação possa modificar um recurso por vez, mantendo a consistência e eficiência do sistema.

Benefícios

Prevenção de Condições de Corrida:
- O maior benefício é evitar as condições de corrida. Essas condições ocorrem quando várias operações tentam acessar e modificar o mesmo recurso simultaneamente, resultando em comportamentos imprevisíveis e dados errados. O lock impede esse problema ao "trancar" o recurso quando uma operação começa, só liberando quando ela termina.
Consistência dos Dados:
- Imagine tentar editar uma entidade ao mesmo tempo que outra pessoa. Bagunça, não é? A técnica garante que apenas uma operação possa modificar um recurso por vez, mantendo tudo em ordem e os dados consistentes, especialmente em sistemas distribuídos.
Desempenho Aprimorado:
- Sabe aquele momento em que várias pessoas tentam fazer a mesma coisa ao mesmo tempo? Como várias requisições tentando atualizar o mesmo valor de cache expirado, o que chamamos de cache stampede. O lock permite que apenas uma operação de atualização aconteça, enquanto as outras aguardam, evitando sobrecarga.
Gerenciamento Eficiente de Recursos:
- Evitando que múltiplas operações pesadas rodem ao mesmo tempo, o mecanismo garante que o sistema não fique sobrecarregado, utilizando melhor os recursos disponíveis e evitando picos desnecessários de uso de CPU e memória.

Aplicações

API Rate Limiting:
- Já viu aquelas mensagens de "você atingiu o limite de requisições"? O mecanismo pode garantir que múltiplas requisições simultâneas de um mesmo usuário não ultrapassem o limite permitido, mantendo tudo sob controle.
Sincronização de Tarefas:
- Em ambientes com vários servidores ou processos, a técnica é como um maestro, garantindo que apenas uma instância de uma tarefa agendada seja executada por vez, evitando duplicações e sobrecarga.

E essas são apenas algumas das muitas aplicações desta técnica. Em qualquer cenário onde operações concorrentes possam causar problemas, ela se prova uma ferramenta valiosa para manter a integridade e eficiência do sistema.

Exemplos de Implementação

Node.js

Vamos criar um exemplo simples usando Node.js com Redis como sistema de cache:

const redis = require('redis');
const { promisify } = require('util');

const client = redis.createClient();
const setAsync = promisify(client.set).bind(client);
const delAsync = promisify(client.del).bind(client);

async function acquireLock(key, ttl) {
    const lockKey = `lock:${key}`;
    const result = await setAsync(lockKey, 'locked', 'NX', 'EX', ttl);
    return result === 'OK';
}

async function releaseLock(key) {
    const lockKey = `lock:${key}`;
    await delAsync(lockKey);
}

async function handleCriticalSection(lockKey) {
    const ttl = 10; // tempo de vida do lock em segundos

    const lockAcquired = await acquireLock(lockKey, ttl);

    if (!lockAcquired) {
        throw new Error('Unable to acquire lock');
    }

    try {
        // Executa a operação crítica
        console.log('Executing critical operation...');
    } finally {
        // Libera o lock após a operação
        await releaseLock(lockKey);
    }
}

handleCriticalSection('yago_exemplo')

Laravel

No Laravel, podemos usar a biblioteca Cache para implementar o cache lock de maneira simples:

use Illuminate\Support\Facades\Cache;

function handleCriticalSection($key) {
    $lock = Cache::lock($key, 10); // tempo de vida do lock em segundos

    if (!$lock->get()) {
        throw new Exception('Unable to acquire cache lock.');
    }

    try {
        // Executa a operação crítica
        echo 'Executing critical operation...';
    } finally {
        // Libera o lock após a operação
        $lock->release();
    }
}

handleCriticalSection('yago_exemplo');

Conclusão

Essa técnica é como aquele organizador indispensável em qualquer evento caótico. Ela gerencia a concorrência em operações críticas, mantém a integridade dos dados e a eficiência do sistema.

Em um mundo onde sistemas distribuídos e de alta carga são a regra, implementar um mecanismo de bloqueio é crucial para garantir operações seguras e eficazes. Adotando essa técnica, você garante que suas aplicações sejam robustas e confiáveis, mesmo sob alta demanda. Então, na próxima vez que estiver enfrentando problemas de concorrência, lembre-se deste aliado na organização e eficiência dos sistemas.

Por que o Dia 31 Causa Problemas e Como Solucioná-los

Yago Costa Ayala — Sat, 01 Jun 2024 21:06:18 +0000

Manipular datas é uma tarefa comum, mas pode se transformar em um verdadeiro desafio, especialmente no fim dos meses. Vamos explorar por que os bugs são mais frequentes no dia 31 e como evitá-los em PHP/Laravel e JavaScript.

Como Datas Funcionam

Antes de mais nada, precisamos entender brevemente como as datas funcionam na programação. Datas são geralmente tratadas como o número de milissegundos desde 1 de janeiro de 1970, a famosa Época Unix. Essa representação numérica permite manipular datas com operações matemáticas simples. No entanto, o problema surge quando tentamos ajustar datas em meses com diferentes números de dias.

O Problema com a Manipulação de Datas

Cada mês tem um número diferente de dias, o que pode causar problemas quando tentamos passar de um mês para outro. Por exemplo, se você começa com uma data no dia 31 e tenta ir para o mês seguinte, o resultado pode ser inesperado porque nem todos os meses têm 31 dias.

Exemplo em JavaScript

Imagine que você está construindo um calendário e precisa navegar pelos meses.

const toggleMonth = (type) => {
  let date = new Date(selectedYear, selectedMonth, selectedDay);

  if (type === 'next') {
    date.setMonth(date.getMonth() + 1);
  } 
  if (type === 'previous') {
    date.setMonth(date.getMonth() - 1);
  }

  setSelectedYear(date.getFullYear());
  setSelectedMonth(date.getMonth());
  setSelectedDay(date.getDate());
};

Resultado do Código Problemático

Suponha que selectedYear seja 2023, selectedMonth seja 4 (maio) e selectedDay seja 31.

Quando incrementamos o mês, date.setMonth(date.getMonth() + 1) muda para junho, mas como junho tem apenas 30 dias, o navegador ajusta automaticamente para 1 de julho.

Solução:

const toggleMonth = (type) => {
  let date = new Date(selectedYear, selectedMonth, 1); // Comece do primeiro dia do mês

  if (type === 'next') {
    date.setMonth(date.getMonth() + 1);
  } else if (type === 'previous') {
    date.setMonth(date.getMonth() - 1);
  }

  const lastDayOfMonth = new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();
  setSelectedDay(Math.min(selectedDay, lastDayOfMonth)); // Ajuste o dia se necessário
  setSelectedYear(date.getFullYear());
  setSelectedMonth(date.getMonth());
};

Aqui, começamos no dia 1 do mês e depois ajustamos para garantir que não vamos para um dia que não existe no mês. Isso evita que 31 de maio se transforme em 1 de julho ao invés de 30 de junho.

Exemplo em PHP/Laravel

No Laravel, imagine que você quer pegar o último dia do mês anterior:

Código Problemático:

$lastDayOfPreviousMonth = Carbon::now()->subMonth()->endOfMonth();

Resultado do Código Problemático

Imagine que hoje seja 31 de março:

Usando Carbon::now()->subMonth(), a data muda para 3 de março (em anos não bissextos).
Quando aplicamos ->endOfMonth(), a data é ajustada para o último dia de março, resultando em 31 de março, o que não é o esperado.

Solução:

$lastDayOfPreviousMonth = Carbon::now()->startOfMonth()->subMonth()->endOfMonth();

Nesta solução, garantimos que começamos no primeiro dia do mês atual antes de subtrair um mês. Isso evita problemas ao lidar com meses de diferentes durações. Dessa forma, se hoje for 31 de março, o código corretamente retorna 28 ou 29 de fevereiro, conforme o caso.

Conclusão

Manipular datas pode ser complicado, especialmente no final dos meses. Começando de uma data segura e ajustando conforme necessário, você pode evitar muitos bugs comuns. Aplique essas melhorias no seu código e evite dores de cabeça em momentos cruciais!

Referências

Idempotência: A Chave para Evitar Duplicações

Yago Costa Ayala — Sat, 25 May 2024 00:03:27 +0000

Dados duplicados, transações duplicadas, usuários com o mesmo CPF...

Todo mundo já passou por isso, e resolver é algo bem tranquilo, mas poucos sabem o termo que as grandes empresas usam. É aí que entra a idempotência, um conceito essencial que pode salvar a sua pele (e a do seu sistema). Vamos explorar o que é idempotência, por que ela é importante, casos reais onde ela faz a diferença, e como você pode implementá-la com um exemplo em Node.js.

O Que é Idempotência?

Imagina que você está fazendo uma compra online. Você clica no botão "comprar" e, por algum motivo, a página demora para carregar. Você clica de novo, e de novo, com medo de que sua compra não tenha sido registrada. De repente, você percebe que comprou três vezes o mesmo item! Se o sistema de compras fosse idempotente, ele garantiria que apenas uma compra fosse processada, não importa quantas vezes você clicasse no botão.

Na computação, uma operação é idempotente se produzir o mesmo resultado, mesmo que seja realizada várias vezes. Ou seja, clicar várias vezes no botão "comprar" deveria resultar em apenas uma compra.

Por Que a Idempotência é Importante?

Tolerância a Falhas: Em qualquer sistema, falhas podem ocorrer. Se uma solicitação falhar, você pode tentar de novo sem medo de duplicar a operação.
Consistência: Em sistemas onde manter dados consistentes é crucial, a idempotência evita a duplicação de operações, garantindo que tudo permaneça em ordem.
Simplicidade na Recuperação de Erros: Com operações idempotentes, a recuperação de erros é mais fácil. Se algo der errado, é só tentar de novo, sabendo que o resultado será o mesmo.

Métodos HTTP e Idempotência

GET: Por definição, as requisições GET devem ser idempotentes. Pedir o mesmo recurso várias vezes não altera o estado do recurso.
PUT: A operação PUT deve ser idempotente. Enviar uma requisição PUT múltiplas vezes deve atualizar um recurso com o mesmo estado.
DELETE: Idealmente, DELETE deve ser idempotente. Deletar um recurso várias vezes não deve resultar em erro, pois o recurso já foi removido.
POST: A operação POST não é idempotente por natureza, pois cada requisição POST pode resultar na criação de um novo recurso. No entanto, a idempotência pode ser implementada em POSTs através de técnicas como chaves de idempotência.

Casos de Uso Reais

No setor financeiro, a idempotência é essencial para evitar cobranças duplicadas. Empresas como PayPal e Stripe implementam idempotência em suas APIs de pagamento. Quando uma solicitação de pagamento é enviada, um identificador único é usado para garantir que, mesmo que a solicitação seja repetida devido a falhas de rede, o cliente não será cobrado duas vezes.

Plataformas de reservas de voos e hotéis, como Expedia e Booking.com, utilizam idempotência para garantir que reservas duplicadas não sejam criadas. Se uma solicitação para reservar um quarto ou um voo for repetida, a plataforma verifica se a reserva já foi feita e evita duplicações.

Em redes sociais como Facebook e Twitter, a idempotência é usada ao criar posts ou enviar mensagens. Se um usuário acidentalmente submeter a mesma postagem várias vezes, o sistema pode reconhecer a duplicação e evitar múltiplos posts idênticos.

Como implementar ?

Aqui está um exemplo simples de como implementar idempotência em uma API RESTful usando Node.js e Express. Teremos dois endpoints: um para gerar uma nova chave de idempotência (UUID) e outro para criar um recurso usando essa chave.



const express = require('express');
const { v4: uuidv4 } = require('uuid');
const app = express();
app.use(express.json());

const idempotencyStore = new Set();

app.get('/generate-key', (req, res) => {
    const idempotencyKey = uuidv4();
    res.send({ idempotencyKey });
});

app.post('/create-resource', (req, res) => {
    const idempotencyKey = req.headers['idempotency-key'];
    if (!idempotencyKey) {
        return res.status(400).send('Idempotency Key is required');
    }

    if (idempotencyStore.has(idempotencyKey)) {
        return res.status(200).send({ message: 'Request already processed' });
    }

    idempotencyStore.add(idempotencyKey);

    res.status(201).send({ message: 'Resource created successfully' });
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

Neste exemplo, um endpoint (/generate-key) gera uma nova chave de idempotência (UUID) e o outro endpoint (/create-resource) utiliza essa chave para garantir que a operação de criação de recursos seja idempotente. Se uma solicitação com a mesma chave de idempotência for recebida novamente, o servidor retorna uma mensagem indicando que a solicitação já foi processada, em vez de criar um novo recurso.

Como podemos melhorar ?

Se o seu servidor utiliza um load balancer, armazenar chaves de idempotência na memória local pode não ser eficaz, pois cada instância do servidor teria seu próprio armazenamento. Em vez disso, use um banco de dados distribuído como o Redis para garantir que todas as instâncias do servidor possam acessar e compartilhar o mesmo conjunto de chaves.
Em vez de simplesmente gerar um UUID, podemos torná-lo mais específico concatenando-o com um valor do usuário, como o username ou namespace. Isso ajuda a evitar colisões de chaves e torna a chave mais significativa.
Para evitar que o armazenamento cresça indefinidamente, é uma boa prática definir um tempo de expiração para as chaves. Configurar o Redis para expirar as chaves após um período de tempo razoável garante que o banco de dados seja limpo automaticamente e não cresça indefinidamente.

Conclusão

A idempotência é um princípio essencial para construir sistemas resilientes e confiáveis. Entender como aplicar esse conceito pode melhorar significativamente a robustez de APIs e sistemas distribuídos. Empresas como PayPal, Stripe, Expedia e Facebook utilizam idempotência para garantir a consistência e a segurança em suas operações. Ao implementar idempotência, garantimos que nossos sistemas possam lidar com falhas e repetições de maneira previsível e segura.