How to check if recaptcha passed in ajax?

[engin-can]

I really like this lib, but how can I add an extra client side (ajax) check if the recaptcha was successfully completed? I see the following code, but I am not sure how I am supposed to use that:

<script type="text/javascript">
    // Submit function to be called, after reCAPTCHA was successful.
    var onSubmit_XXX = function(token) {
        console.log("reCAPTCHA validated for 'data-widget-uuid=\"XXX\"'")
    };
</script>

[AltusBarry]

Hey. You can take a peek at our invisible implementation for some pointers: https://github.com/praekelt/django-recaptcha/blob/develop/captcha/templates/captcha/includes/js_v2_invisible.html

Then you'd want to override the includes/js_v2_checkbox.html template with a custom implementation for your project. To override the templates check out the django docs on template overrides: https://docs.djangoproject.com/en/2.2/howto/overriding-templates/

The onSubmit_{{ uuid }} methods you see is our default for the Google reCAPTCHA data attr data-callback. For more info on what to expect with the callback method, look at the Documentation for reCAPTCHA v2 : https://developers.google.com/recaptcha/docs/display

[engin-can]

@AltusBarry

Hey. You can take a peek at our invisible implementation for some pointers: https://github.com/praekelt/django-recaptcha/blob/develop/captcha/templates/captcha/includes/js_v2_invisible.html

Then you'd want to override the includes/js_v2_checkbox.html template with a custom implementation for your project. To override the templates check out the django docs on template overrides: https://docs.djangoproject.com/en/2.2/howto/overriding-templates/

The onSubmit_{{ uuid }} methods you see is our default for the Google reCAPTCHA data attr data-callback. For more info on what to expect with the callback method, look at the Documentation for reCAPTCHA v2 : https://developers.google.com/recaptcha/docs/display

I tried that, but it didn't work. Any idea what's wrong in my override attempt? I tried creating a 'includes' folder in my 'captcha' folder as well.

Custom template folder

Custom template

Code in custom template is not fired

[engin-can]

@AltusBarry

Hey. You can take a peek at our invisible implementation for some pointers: https://github.com/praekelt/django-recaptcha/blob/develop/captcha/templates/captcha/includes/js_v2_invisible.html

Then you'd want to override the includes/js_v2_checkbox.html template with a custom implementation for your project. To override the templates check out the django docs on template overrides: https://docs.djangoproject.com/en/2.2/howto/overriding-templates/

The onSubmit_{{ uuid }} methods you see is our default for the Google reCAPTCHA data attr data-callback. For more info on what to expect with the callback method, look at the Documentation for reCAPTCHA v2 : https://developers.google.com/recaptcha/docs/display

Would it be safe to set a variable to true in callback, when captcha is passed, or is there a safer way?

let captchaCompleted = false

function onSubmit_.....() {
    captchaCompleted = true
}

[engin-can]

@AltusBarry

Also, my template is not overriding the original one.
Any idea why this is not working?

project structure

project
----templates
--------captcha
------------js_v2_checkbox.html

settings.py

TEMPLATES = [
    {
        ...
        'DIRS': [os.path.join(BASE_DIR, 'templates')],
        'APP_DIRS': True,
        ...
    },
]