Skip to main content

taCAPTCHA Tool

Privacy-friendly CAPTCHA that protects user privacy while preventing bot abuse.

🎯 What is taCAPTCHA?​

taCAPTCHA is a privacy-first CAPTCHA solution that provides bot protection without compromising user privacy. It uses advanced behavioral analysis instead of traditional image-based challenges.

⚙️ Setup & Configuration​

Basic Implementation​

<!-- Include taCAPTCHA CSS and JavaScript -->
<link rel="stylesheet" href="https://api.trustedaccounts.org/static/trusted-accounts-captcha.css">
<script async defer src="https://api.trustedaccounts.org/static/trusted-accounts-captcha.js" type="module"></script>

<form method="post" action="/submit">
  <input type="text" name="username" placeholder="Username" required>
  <input type="email" name="email" placeholder="Email" required>
  
  <!-- Add taCAPTCHA to your form -->
  <ta-captcha name="captcha"></ta-captcha>
  
  <button type="submit">Submit</button>
</form>

Advanced Configuration​

<!-- Custom styling and behavior -->
<ta-captcha 
  name="captcha"
  data-theme="dark"
  data-size="compact"
  data-callback="onCaptchaComplete">
</ta-captcha>

<script>
function onCaptchaComplete(token) {
  console.log('CAPTCHA completed:', token);
  // Enable form submission
  document.getElementById('submit-btn').disabled = false;
}
</script>

🔧 Server-Side Verification​

Node.js/Express Example​

app.post('/submit', async (req, res) => {
  const { captcha } = req.body;
  
  try {
    // Verify the CAPTCHA token
    const verifyData = await fetch('https://api.trustedaccounts.org/v1/verify/signature', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ payload: captcha })
    }).then(res => res.json());
    
    if (verifyData.verified) {
      // CAPTCHA is valid, process the form
      res.json({ success: true, message: 'Form submitted successfully' });
    } else {
      res.status(400).json({ error: 'CAPTCHA verification failed' });
    }
  } catch (error) {
    console.error('CAPTCHA verification error:', error);
    res.status(500).json({ error: 'Verification service unavailable' });
  }
});

Python/Django Example​

import requests
from django.http import JsonResponse
from django.views.decorators.csrf import csrf_exempt
import json

@csrf_exempt
def submit_form(request):
    if request.method == 'POST':
        captcha_token = request.POST.get('captcha')
        
        # Verify CAPTCHA token
        verify_url = 'https://api.trustedaccounts.org/v1/verify/signature'
        verify_data = {'payload': captcha_token}
        
        try:
            response = requests.post(verify_url, json=verify_data)
            verify_result = response.json()
            
            if verify_result.get('verified'):
                # CAPTCHA is valid, process the form
                return JsonResponse({
                    'success': True, 
                    'message': 'Form submitted successfully'
                })
            else:
                return JsonResponse({
                    'error': 'CAPTCHA verification failed'
                }, status=400)
                
        except requests.RequestException as e:
            return JsonResponse({
                'error': 'Verification service unavailable'
            }, status=500)
    
    return JsonResponse({'error': 'Invalid request'}, status=400)

PHP Example​

<?php
if ($_POST) {
    $captcha_token = $_POST['captcha'];
    
    // Verify CAPTCHA token
    $verify_url = 'https://api.trustedaccounts.org/v1/verify/signature';
    $verify_data = json_encode(['payload' => $captcha_token]);
    
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $verify_url);
    curl_setopt($ch, CURLOPT_POST, true);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $verify_data);
    curl_setopt($ch, CURLOPT_HTTPHEADER, ['Content-Type: application/json']);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    
    $response = curl_exec($ch);
    $http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    curl_close($ch);
    
    if ($http_code === 200) {
        $result = json_decode($response, true);
        
        if ($result['verified']) {
            // CAPTCHA is valid, process the form
            echo json_encode(['success' => true, 'message' => 'Form submitted successfully']);
        } else {
            http_response_code(400);
            echo json_encode(['error' => 'CAPTCHA verification failed']);
        }
    } else {
        http_response_code(500);
        echo json_encode(['error' => 'Verification service unavailable']);
    }
}
?>

🎨 Customization Options​

Themes​

<!-- Light theme (default) -->
<ta-captcha name="captcha" data-theme="light"></ta-captcha>

<!-- Dark theme -->
<ta-captcha name="captcha" data-theme="dark"></ta-captcha>

<!-- Auto theme (follows system preference) -->
<ta-captcha name="captcha" data-theme="auto"></ta-captcha>

Sizes​

<!-- Compact size -->
<ta-captcha name="captcha" data-size="compact"></ta-captcha>

<!-- Normal size (default) -->
<ta-captcha name="captcha" data-size="normal"></ta-captcha>

<!-- Large size -->
<ta-captcha name="captcha" data-size="large"></ta-captcha>

Custom Styling​

/* Custom taCAPTCHA styling */
ta-captcha {
  --captcha-primary-color: #007bff;
  --captcha-background-color: #f8f9fa;
  --captcha-border-radius: 8px;
  --captcha-border: 1px solid #dee2e6;
  --captcha-padding: 16px;
}

/* Dark mode customization */
@media (prefers-color-scheme: dark) {
  ta-captcha {
    --captcha-background-color: #343a40;
    --captcha-border-color: #495057;
  }
}

📊 Analytics & Monitoring​

Monitor CAPTCHA performance:

  • Success Rate: Percentage of successful verifications
  • Bot Detection: Number of blocked bot attempts
  • User Experience: Average completion time
  • Error Rates: Failed verification attempts

🛡️ Privacy Features​

  • No Personal Data: No collection of personal information
  • Behavioral Analysis: Uses interaction patterns only
  • GDPR Compliant: Full compliance with privacy regulations
  • Transparent: Clear indication of CAPTCHA presence
  • Accessible: Works with screen readers and assistive technologies

🎯 Use Cases​

  • Form Protection: Prevent spam submissions
  • Registration Security: Block automated account creation
  • Comment Systems: Filter out bot comments
  • E-commerce: Protect checkout processes
  • API Endpoints: Secure public APIs

📈 Best Practices​

  1. Strategic Placement: Place CAPTCHA near submit buttons
  2. User Experience: Use compact size for better UX
  3. Fallback Methods: Provide alternative verification
  4. Performance: Load CAPTCHA asynchronously
  5. Testing: Test with real users for accessibility

🔗 Related Tools​

Ready to implement? Get your publishable key from the Developer Console and start protecting your forms!