reCAPTCHA v3
en CapMonster Cloud

Werken met CapMonster Cloud via de API bestaat doorgaans uit de volgende stappen:

1. Ga naar de pagina van het beheerpaneel van reCAPTCHA.

2. Registreer een nieuwe site en kies het type captcha — reCAPTCHA v3

3. Verkrijg twee sleutels:

• Site key — openbare sleutel (wordt aan de frontendzijde gebruikt);
• Secret key — geheime sleutel (wordt aan de serverzijde gebruikt voor verificatie)

U kunt de instellingen openen, waar u bijvoorbeeld extra domeinen kunt opgeven waarop reCAPTCHA gebruikt mag worden of meldingen kunt configureren bij problemen met de site of een toename van verdacht verkeer.

4. Codevoorbeelden voor de clientzijde

De eenvoudigste manier om reCAPTCHA v3 te gebruiken, is door de JavaScript API te laden en attributen aan een knop toe te voegen.

API laden:

<script src="https://www.google.com/recaptcha/api.js"></script>

Callback-functie voor het formulier:

<script>
  function onSubmit(token) {
    document.getElementById("form").submit();
  }
</script>

Knop met reCAPTCHA-attributen:

<button class="g-recaptcha" 
        data-sitekey="reCAPTCHA_sitekey" 
        data-callback='onSubmit' 
        data-action='submit'>Submit</button>

Voor volledige controle gebruikt u grecaptcha.execute met de parameter render:

API laden met sleutel:

<script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>

Programmeerbare aanroep:

<script>
  function onClick(e) {
    e.preventDefault();
    grecaptcha.ready(function() {
      grecaptcha.execute('reCAPTCHA_sitekey', {action: 'submit'}).then(function(token) {
          // Verzend de token naar de server voor verificatie
      });
    });
  }
</script>

De token moet direct naar de server worden verzonden voor verificatie.

Belangrijke opmerkingen:

• Geldigheidsduur van de token: de token die door reCAPTCHA v3 wordt teruggegeven, is 2 minuten geldig. Zorg ervoor dat u deze binnen die tijd naar de server stuurt.
• Verificatie aan de serverzijde: nadat de server de token heeft ontvangen, moet hij een POST-verzoek sturen naar https://www.google.com/recaptcha/api/siteverify met de parameters:
  – secret: uw geheime sleutel
  – response: de token die van de client is ontvangen
  – remoteip (optioneel): IP-adres van de gebruiker
• De server van Google retourneert een JSON-antwoord met informatie over het verificatieresultaat.

Meer gedetailleerde informatie vindt u in de documentatie van de captcha zelf.

5. Voer nu aan de serverzijde de controle van het antwoord uit

Voorbeeld in PHP

<?php
// Uw geheime reCAPTCHA v3-sleutel (Secret Key)
$secret = 'YOUR_SECRET_KEY';

// Token uit het formulier ophalen
$token = $_POST['recaptcha-token'] ?? '';

// Verzoek naar Google sturen om de token te controleren
$response = file_get_contents(
    "https://www.google.com/recaptcha/api/siteverify?secret={$secret}&response={$token}"
);

$result = json_decode($response, true);

// Controleren of de verificatie gelukt is en wat de vertrouwensscore is
if ($result['success'] && $result['score'] >= 0.5 && $result['action'] === 'submit') {
    echo "Verificatie geslaagd";
} else {
    http_response_code(403);
    echo "Verificatie mislukt";
}
?>

Opmerkingen:

• Zorg ervoor dat aan de clientzijde de token in een verborgen formulierveld met de naam recaptcha-token naar de server wordt verzonden:

<input type="hidden" name="recaptcha-token" id="recaptcha-token">


• De drempel van de score kan aangepast worden afhankelijk van de gewenste strengheid (bijvoorbeeld 0.3–0.7).
• Extra controle op action === 'submit' verhoogt de veiligheid en helpt te bevestigen dat de token voor de specifieke actie op de pagina is gegenereerd.