Hi Chris! I got excited at first about it too, but then after a quick search on google (oh the irony) I found this: https://2captcha.com/2captcha-api#invisible Those guys at 2captcha have already found a way to beat it) So from what I understand after reading their description new ReCaptcha isn't that invisible - I wouldn't consider it (on it's own) a sufficient protection against spammers.

Hi Chris

I wanted to make Change from Umbraco reCAPTCHA 2 to invisible, but I didn't do it because it's beta now, am I right? It's not released yet.

I think we will do it like package, as we made it for reCAPTCHA 2 - https://our.umbraco.org/projects/collaboration/recaptcha-field-for-umbraco-forms/

Thanks

Alex

Hello Luke and Alex,

Did you guys ended up integrating the invisible reCaptcha with Umbraco forms ? I am trying to do the same however, having trouble while generating the recaptcha token on form submission as it creates bit of disturbance while continuing the default workflow.

Thanks, Namrata

Hello Alex,

Thanks for the response.

I am using Umbraco 12.0.1 and Umbraco Forms (12.0.0). I am trying to integrate the invisible enterprise reCaptcha v2.

Here is the custom field type code :

@using Umbraco.Forms.Web
@using Microsoft.Extensions.Configuration
@model Umbraco.Forms.Web.Models.FieldViewModel
@inject IConfiguration Configuration
@{
    var siteKey = Configuration.GetSection("ReCaptchaEnterprise")["PublicKey"];
        if (!string.IsNullOrEmpty(siteKey))
        {   Html.AddFormThemeScriptFile("https://www.google.com/recaptcha/enterprise.js?render=" + siteKey);
            Html.AddFormThemeScriptFile("https://www.google.com/recaptcha/api.js?render="+ siteKey);
            <div class="g-recaptcha"
                 data-sitekey="@siteKey"
                 data-callback="onSubmit"
                 data-size="invisible">
            </div>


<script type="application/javascript">
            let formElement; 

            function onSubmit(){
                console.log("Form Element", formElement);
                formElement.submit();
            }
            document.addEventListener('DOMContentLoaded', function(){
                window.grecaptcha.ready(function(){
                    document.querySelectorAll(".umbraco-forms-form form")
                        .forEach((form) =>  { 
                            form.addEventListener("submit", (event) => {
                                event.preventDefault();
                                formElement = event.target;
                                grecaptcha.execute();
                            }, true)
                        })
                    })

            }) 

        </script>


    }
    else
    {
        <p class="error">ERROR: reCAPTCHA is missing the Site Key. Please update the configuration to include a value.</p>
    }
}

However, there are two strange behaviour :

• For every request reCaptcha prompts the image dialog which negates the entire idea of having an invisible reCaptcha.
• After form submit event when the form submission is intercepted by the script it doesn't submits the form and just lands on the same page not following the default workflow.

I am not sure what I am doing is even possible in Umbraco environment or am I missing out on anything.

Thanks, Namrata.

is working on a reply...