Ofuscação de Dados

O modo de ofuscação do widget permite proteger informações sensíveis de bots. Um caso de uso comum é ofuscar endereços de e-mail em sites, evitando que bots automatizados os coletem.

Casos de Uso

Ocultar Endereços de E-mail e Números de Telefone: Proteja endereços de e-mail e números de telefone em sites para evitar que bots automatizados coletem essas informações.
Mascarar Identificadores Pessoais: Oculte identificadores pessoais, como nomes de usuário, IDs ou números de conta que poderiam ser usados para fins maliciosos.
Ofuscar Links para Download: Oculte links diretos para download de arquivos ou software para evitar acesso não autorizado ou scraping.

Como Funciona

Semelhante ao mecanismo de prova de trabalho usado para desafios ALTCHA, a ofuscação emprega uma abordagem de prova de trabalho (PoW) com base na criptografia AES simétrica.

Os dados ofuscados fornecidos ao widget são criptografados usando uma chave de criptografia e um vetor de inicialização com base em um número aleatório. Assim como no desafio PoW, o cliente deve iterar sobre uma série de números para encontrar um vetor de inicialização correspondente.

A chave de criptografia é compartilhada com o cliente e, caso não seja especificada, é padrão para uma string vazia. O objetivo não é fornecer um algoritmo criptográfico seguro, mas usar um mecanismo de prova de trabalho que permita a qualquer dispositivo capaz de descriptografar os dados ocultos.

Complexidade

A complexidade de descriptografia depende da faixa de números usada. Por padrão, a faixa é de 0 a 10.000 e pode ser ajustada usando o script. O tempo de computação é cerca de 35% maior em comparação com o desafio PoW.

Configuração

Após integrar o widget e habilitar o plugin de ofuscação, configure a string obfuscated no widget. Observe que o modo de ofuscação não utiliza challengeurl:

<p>Envie-nos um e-mail e entraremos em contato em breve.</p>

<div>
  <span>E-mail:</span>

  <altcha-widget
    obfuscated="P7bJsUgzxP416d1voeF/QnQOD5g7GItB/zdfkoBrKgZK4N4IYkDJqg=="
    floating
  >
    <button>Clique para revelar</button>
  </altcha-widget>
</div>

Quaisquer elementos dentro da tag <altcha-widget> serão exibidos como placeholders para dados ofuscados. O widget detecta automaticamente elementos clicáveis, como tags button e a, que, quando clicados, acionam o processo de verificação e desofuscação. Você pode personalizar qual elemento servirá como botão de ação usando o atributo data-clarify-button.

É recomendado usar o atributo floating para oferecer uma experiência de usuário mais suave.

Demonstração

O código acima renderizará algo semelhante a esta demonstração:

Envie-nos um e-mail e entraremos em contato em breve.

E-mail:

Clique no link Clique para revelar para exibir o endereço de e-mail real.

O widget pode mascarar quaisquer dados textuais, aqui está uma demonstração com um endereço ofuscado:

Nosso Endereço:

Gerando Dados Ofuscados

Para gerar dados ofuscados para o widget, use o ofuscador:

Alternativamente, use o script disponível no GitHub:

bun run scripts/obfuscate.ts "mailto:hello@example.com"

Este comando gera dados codificados em base64 que podem ser usados diretamente no atributo obfuscated.

Consulte o script para opções de personalização, como modificar a faixa de número aleatório ou usar uma chave de criptografia personalizada.

Chaves de Criptografia Personalizadas

A chave de criptografia padrão é uma string vazia. Para usar uma chave de criptografia personalizada ao ofuscar dados, configure a chave usando o script.

Para aplicar uma chave de criptografia personalizada, anexe-a aos dados ofuscados no formato <base64>?key=<my_key> e defina a string inteira como o atributo obfuscated.

Alternativamente, você pode configurar o atributo obfuscated como ?key=(prompt) (ou especificar um rótulo de prompt personalizado com ?key=(prompt:Digite a Senha)). Isso solicitará que o usuário insira a chave antes de descriptografar os dados, garantindo que apenas usuários que conheçam a chave possam acessar as informações ocultas.