Verifying recaptcha "We detected that your site is not verifying reCAPTCHA solutions."

[gingerchew]

So I just installed the plugin, got everything working, didn't get a test sometimes, but once I got one I went to confirm it went through with google. When I open up the site in the recaptcha website, it says my site is not verifying recaptcha results

[exact message]

We detected that your site is not verifying reCAPTCHA solutions. This is required for the proper use of reCAPTCHA on your site. Please see our developer site for more information.

I looked through their site for documentation, but I couldn't make heads or tails of it (Inexperienced at REST calls). I was under the impression that this was handled by the snippet or the render script?

If there is extra coding I have to do, I'd appreciate any help that can be given

[sepiariver]

Can you post your FormIt call and HTML with the recaptcha render snippet please?

[gingerchew]

Woah, thanks for the fast response, Here's the formIt and the form

[[!FormIt?
    &hooks=`recaptchav2,spam,FormItSaveForm,email,redirect`
    &formName=`[[++site_name]] | [[*pagetitle]] Form`
    &formEncrypt=`1`
    &formFields=`fname,lname,email,phone,message,treatment`
    &fieldNames=`fname==First Name,lname==Last Name,email==Email,phone==Phone Number,message==Message,treatment==Treatment`
    &spamEmailFields=`workemail`
    &spamCheckIp=`1`
    &emailTpl=`[[++site_name:lcase:stripString=` `]]-email`
    &emailSubject=`Contact Lead From [[++site_name]]`
    &emailTo=`[[++lead-email]]`
    &emailToName=`[[++site_name]]`
    &emailFrom=`[[++sending-email]]`
    &emailFromName=`[[++site_name]]`
    &validate=`workemail:blank,fname:required,lname:required,email:email:required,phone:minValue=^9^:macValue=^16^:required,treatment:required,message:stripTags`
    &redirectTo=`[[!getResourceField? &id=`[[++settings]]` &field=`confirmation` &isTV=`1` &processTV=`1`]]`
]]
[[!+fi.validation_error]]

<form action="[[~[[*id]]]]" method="post" id="contact-form">
    <input class="mb0" type="hidden" name="workemail" value="">

    <label for="fname" class="offscreen mb0 mt0"></label>
    <input class="mb8" type="text" value="[[!+fi.fname]]" name="fname"  id="fname" placeholder="FIRST NAME">

    <label for="lname" class="offscreen mb0 mt0"></label>
    <input class="mb8" type="text" value="[[!+fi.lname]]" name="lname"  id="lname" placeholder="LAST NAME">

    <label for="email" class="offscreen mb0 mt0"></label>
    <input class="mb8" type="email" value="[[!+fi.email]]" name="email"  id="email" placeholder="EMAIL">

    <label for="phone" class="offscreen mb0 mt0"></label>
    <input class="mb8" type="tel" value="[[!+fi.phone]]" name="phone"  id="phone" placeholder="PHONE">
    <div class="select-option">
        <i class="ti-angle-down"></i>
        <select name="treatment" id="treatment" value="[[!+fi.treatment]]">
            <option selected value="" disabled>[[*select-label]]</option>
            [[getImageList? &tvname=`form-options`&tpl=`option-row`]]
        </select>
    </div>   
    <label for="message" class="offscreen mb0 mt0"></label>
    <textarea name="message" id="message" cols="30" rows="10" value="[[!+fi.message]]" placeholder="MESSAGE">[[!+fi.message]]</textarea>
    <div class="form-item">
        [[!recaptchav2_render? &tpl=`recaptchav2_invisible_m` &form_id=`contact-form`]]
        [[!+fi.error.recaptchav2_error]]
    </div>
</form>

and here's the chunk that we used for the render script

<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl=[[++cultureKey]]"></script>
<script>function recaptchaV2SubmitForm(response){return new Promise(function(){document.getElementById('[[+form_id]]').submit();})}</script>
<input type="submit" class="btn btn-border-accent g-recaptcha" name="submitIt" data-sitekey="[[+site_key]]" data-callback="recaptchaV2SubmitForm" value="send message">

[sepiariver]

Ok and when you say “didn't get a test sometimes” do you mean the email doesn’t come through?

Do the form submissions get saved?

Is there an example of a saved form submission please?

[gingerchew]

I’m not sure, I’m not near a computer currently, I will be tomorrow and I will double check. I’m assuming it did because it did redirect to the confirmation page. I can get you a screenshot once I’m back in work though

[sepiariver]

Thanks. Reason I ask is that, often the g-recaptcha response token is captured in the saved form.

Actually as I write this I realized maybe FormIt is filtering it out. Can you try it without the “formFields” and “fieldNames” properties?

[gingerchew]

Huh, interesting! I’ll definitely double check in the morning

[gingerchew]

Okay so the response token was not in the savedForm response,

First Name: connor
Last Name: wilson
Email: [[REDACTED]]
Phone Number: 5615559999
Message: This is a test from [[REDACTED]]
Treatment: Stem Cell Therapy

Thats the only thing in the form, so you're thinking that if I remove the formFields and fieldNames that might solve the problem of it not parsing the response token? Cause it doesn't see it as a formIt input, or something along those lines?

[sepiariver]

An effective way to test individual functionality is to isolate them. If it were me, I would start with just the recaptchv2 and formitsaveform hooks. No spam hook, no field filters, no validation. Keep it basic. Even use the installed default recaptcha Chunk. If it doesn’t work then it’ll be more obvious where the problem is. If it does work then layer in the other functionality but by bit and test at each stage. Then when it breaks you know what it is. Your form right now has so much stuff going on it makes debugging much more complicated. Please try the most basic call and let us know the results. Thanks.

[sepiariver]

Just to be clear, you don't have to publish a form, that is built in the manner described above, to effectively test and debug. You can (and should) have another Resource set up (unpublished so only you can use it) and go through the process of testing FormIt configurations from most basic, to adding more features etc. It would be very helpful to see what the saved forms contain, in the most basic implementation, to troubleshoot this Extra.

[gingerchew]

Okay sorry for the slow response, its been a hectic workweek. So I did what you said, stripped it down to just the recaptcha and the formitsaveform, and it would save the form. The recaptcha didn't save any token or response to the form. Is there a [[+field]] that I need to put in for the recaptcha to process?

[sepiariver]

Please set the modx log level to debug, in system settings and post to the test form again. Post here the modx error log please. It would be helpful to clear the error log before doing all this.

So steps, if you will:

1. Clear the modx error log
2. Change log level to debug
3. Submit the test form
4. Copy paste the error log here
5. If in production change log level back to error

Thank you

[gingerchew]

okay, so I did that, and got this in the error logs

Old modTemplateVar getRender outputmethod is deprecated since version 2.2.0. 
[FormIt] Could not load FormItReCaptcha service class.

though I'm pretty sure that first one is unrelated

[sepiariver]

Oh it's the same as this issue: https://github.com/sepiariver/recaptchav2/issues/32

Which is actually a FormIt known issue: https://github.com/Sterc/FormIt/issues/170

It's being fixed in the next version of FormIt, but you can apply the hotfix from here: https://github.com/Sterc/FormIt/pull/193/files

It's safe to apply only that change to the relevant FormIt class file in your installation because when you upgrade that change will also be there. Or you can wait until they release the next version. Sorry I have no control over when they do that, but the PR has been accepted.

[gingerchew]

ooooooh okay nice! thanks for the help!!