Gestione di una risposta CAPTCHA da AWS WAF - AWS WAFAWS Firewall Manager, e AWS Shield Advanced

Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà.

Gestione di una risposta CAPTCHA da AWS WAF

Una AWS WAF regola con un'CAPTCHAazione interrompe la valutazione di una richiesta web corrispondente se la richiesta non ha un token con un timestamp CAPTCHA valido. Se la richiesta è una chiamata GET text/html, l'CAPTCHAazione invia al client un messaggio interstiziale con un puzzle CAPTCHA. Quando non integri l' JavaScript API CAPTCHA, l'interstitial esegue il puzzle e, se l'utente finale lo risolve con successo, invia nuovamente la richiesta automaticamente.

Quando integri l' JavaScript API CAPTCHA e personalizzi la gestione del CAPTCHA, devi rilevare la risposta CAPTCHA di terminazione, fornire il CAPTCHA personalizzato e, se l'utente finale risolve con successo il puzzle, inviare nuovamente la richiesta web del cliente.

L'esempio di codice seguente mostra come eseguire tale operazione.

Nota

La risposta AWS WAF CAPTCHA all'azione ha un codice di stato HTTP 405, che utilizziamo per riconoscere la risposta in questo codice. CAPTCHA Se l'endpoint protetto utilizza un codice di stato HTTP 405 per comunicare qualsiasi altro tipo di risposta per la stessa chiamata, questo codice di esempio genererà anche un puzzle CAPTCHA per quelle risposte. 

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="<Integration URL>/jsapi.js" defer></script>
</head>
<body>
    <div id="my-captcha-box"></div>
    <div id="my-output-box"></div>

    <script type="text/javascript">
    async function loadData() {
        // Attempt to fetch a resource that's configured to trigger a CAPTCHA
        // action if the rule matches. The CAPTCHA response has status=HTTP 405.
        const result = await AwsWafIntegration.fetch("/protected-resource");

        // If the action was CAPTCHA, render the CAPTCHA and return

        // NOTE: If the endpoint you're calling in the fetch call responds with HTTP 405
        // as an expected response status code, then this check won't be able to tell the
        // difference between that and the CAPTCHA rule action response.

        if (result.status === 405) {
            const container = document.querySelector("#my-captcha-box");
            AwsWafCaptcha.renderCaptcha(container, {
                apiKey: "...API key goes here...",
                onSuccess() {
                    // Try loading again, now that there is a valid CAPTCHA token
                    loadData();
                },
            });
            return;
        }

        const container = document.querySelector("#my-output-box");
        const response = await result.text();
        container.innerHTML = response;
    }

    window.addEventListener("load", () => {
        loadData();
    });
    </script>
</body>
</html>