Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • lori ryan 239 posts 573 karma points
    May 13, 2021 @ 11:19
    lori ryan
    0

    Umbraco forms recaptcha v3 - The g-recaptcha-response hidden field for reCAPTCHA V3 is missing and thus unable to be verified

    I have multiple forms in the same page using recaptcha v3 after i submit the first form it works ok. But other forms then say

    The g-recaptcha-response hidden field for reCAPTCHA V3 is missing and thus unable to be verified

    And I cant submit any forms.

  • lori ryan 239 posts 573 karma points
    May 14, 2021 @ 09:00
    lori ryan
    0

    anyone else come across this?

  • Bjarne Fyrstenborg 1285 posts 4039 karma points MVP 8x c-trib
    May 14, 2021 @ 09:11
    Bjarne Fyrstenborg
    0

    Hi Lori

    I haven't yet tried with multiple forms on the page. Are you using two different forms?

    You could check a token has been generated for both forms and set in the g-recaptcha-response hidden field.

    The following is the standard Fieldtype.Recaptcha3.cshtml but you can always make a copy of this an place this in a custom theme folder and modify this. I would check that the token is generated for both forms.

    @using Umbraco.Forms.Mvc
    @model Umbraco.Forms.Mvc.Models.FieldViewModel
    @{
        var siteKey = Umbraco.Forms.Core.Configuration.GetSetting("RecaptchaV3SiteKey");
        if (!string.IsNullOrEmpty(siteKey))
        {
            @* Google JS reCAPTHA API *@
            Html.AddFormThemeScriptFile(null, "https://www.google.com/recaptcha/api.js?render=" + siteKey);
    
            @* Hidden Field to store token from invisible reCAPTCHA *@
            <input type="hidden" id="@Model.Id" name="g-recaptcha-response" />
    
    
    
    <script>
                var hiddenField = document.getElementById("@Model.Id");
                var timerFunction = function() {
                    grecaptcha.execute('@siteKey', { action: 'umbracoform_submit' }).then(function (token) {
                        // Enable the submit button now we have a token
                        hiddenField.form.querySelector('[type=submit]').removeAttribute('disabled');
                        hiddenField.value = token;
                    });
                    setTimeout(timerFunction, 60*1000);
                };
    
    
                document.addEventListener("DOMContentLoaded", function () {
                    // Disable the submit button for this form, until we actually have a key from Google reCAPTCHA
                    hiddenField.form.querySelector('[type=submit]').setAttribute('disabled','disabled');
    
                    grecaptcha.ready(function () {
                        timerFunction();
                    });
                });
    
            </script>
    
    
        }
        else
        {
            <p class="error">ERROR: ReCaptcha v3 is missing the Site Key - Please update the web.config to include 'key="RecaptchaV3SiteKey"'</p>
        }
    }
    

    Do you get any errors when submitting the second form?

    /Bjarne

Please Sign in or register to post replies

Write your reply to:

Draft