reCaptcha v3
-
Hello and thank you for the plugin.
I am implementing v3 reCaptcha and testing it fails. It seems like reCaptcha is ignored and all emails are sent. To test I changed the user agent in Chrome to Googlebot/2.1 and used my form based on a solution from stackoverflow which also includes a link to ensure the solution works:
https://www.google.com/recaptcha/api2/demo?invisible=true
Using the same solution, my form with reCaptcha just sends the email through.
Any ideas or pointers?
-
Hello,
Thanks for the feedback. I’m not quite sure to completely understand your request tho. Can you please provide more information, in order to help you:
- Are you trying to use the ACF Extended: reCaptcha field?
- If so, is the field rendered on the back-end or the front-end?
- Do you use ACF Form or ACF Extended: Dynamic Forms?
It looks like there’s problem in your stackoverflow topic, as the link you provided leads to a reCpatcha V2 API demo, and not V3.
Regards.
Also,
is there a way to isolate and only use the recaptcha field module? I have found a guide to remove most modules, but I see a lot of additional styles and scripts loaded for things I am not using at all…
Hello,
Well it looks like you created a new answer right after me ?? Please check my first answer, as I need more information to understand your problem.
As of your question about the reCaptcha field isolation, it is not possible as ACF Extended is designed as a all-in-one bundle solution. Some specific modules can be disabled, but not fields.
Regards.
This was a coincidence! We posted on the exact same time! ??
So, to answer your questions:
– I am using the ACF Extended: reCaptcha field
– In the front-end
– I am using the normal acf_formActually you are correct that is in-fact the v2 of the plugin which I noticed after I posted this question. The v3 demo, works somewhat different giving a score that is calculated based on some ‘circumstances’ that I still haven’t found which they are.
https://recaptcha-demo.appspot.com/recaptcha-v3-request-scores.php
So, the question remains, is there a way to ensure that recaptcha is actually properly setup? The only indicator I have is that the recaptcha logo appears and I see no errors in the console. Any more help would be welcome.
As an additional sidenote and as I have asked above, is there a way to isolate and only use the recaptcha field rather than using the whole ACF Extended package? For future versions having a toggle for modules would help. I see no gain in loading styles/scripts in the front-end like modal or repeater related stuff that are not used at all.
Thanks for the reply on the module/field isolation. it would be nice to have it. I see the benefits of a bundle in different scenarios, but for this particular project I am working on is an overkill because I only make use of the recaptcha field.
Is there at least any way to de-register scripts/styles on demand? Is there a list of the enqueued scripts/styles?
Thanks again for the support!
Hello,
Okay I see. So first, you need to make sure the reCaptcha field is required in your field group, otherwise it won’t validate the request with the Google API and won’t generate any score.
Google reCaptcha V3 isn’t very easy to debug as there’s no visual signal that tells you everything is fine (this is the point of being invisible). If you want to debug the score, you can edit the file
/includes/fields/field-recaptcha.php
line:262
and add the following code:acf_log('reCaptcha V3: Response', $response);
Then submit your form, and check your
debug.log
file (you need to enable the WP Debug feature. See documentation).You’ll get a log similar to this one:
reCaptcha V3: Response stdClass Object( [success] => 1 [challenge_ts] => 2020-09-16T13:23:06Z [hostname] => www.acf.dev [score] => 0.9 [action] => homepage )
For additional information about reCaptcha scoring, please refer to the Google documentation.
Concerning your question about field isolation and files enqueue, ACF doesn’t provide any way to enqueue specific files for specific fields. This why when you use
acf_form()
(andacf_form_head()
), ACF will enqueue all its CSS/JS framework (acf.js
,acf-input.js
etc…), preparing the front-end/back-end form to display any possible field. This is why it is not possible to disable/remove a specific field, as ACF Extended use the ACF philosophy.However, as ACF & ACF Extended use the native
wp_enqueue_script()
andwp_enqueue_style()
, you’re free to de-enqueue any files, using available hooks, like:wp_enqueue_scripts
(See documentation). However, I would not recommend doing that unless you really know what you’re doing, as you could break JS and form render.The other solution would be to extract the reCaptcha field from the ACF Extended code base and use it as standalone. To do so, you’ll need some coding knowledge, but that’s not impossible. The field’s code is located in
/acf-extended/includes/fields/field-recaptcha.php
and/acf-extended/assets/acf-extended-fields.js
files. Please understand that I cannot provide any further assistance for such procedure as I’m already overwhelmed by features requests & support questions. I need to stay focused on the plugin itself.Hope it helps!
Regards.
Thank you so much for your thorough explanations. More or less I ended up in the same conclusion regarding recaptcha v3 – that you can’t test is very easily – since I couldn’t find a way to get a lower score by faking it using a different user agent, incognito tabs, etc.
I understand the logic behind enqueuing all the scripts/styles in the acf_form_head, but I don’t totally agree with its logic. The acf_form_head could be loaded with a handler per different form (or even fields), so that it knows what fields are required – maybe there are more efficient ways to do it, but this is what I just came up with. But it’s totally inefficient to load all this additional code for nothing.
Once again thank you for providing the files where the recaptcha plugin lies in. I will definitely give it a try. You have provided me with enough assistance already!
Keep up the good work!
Hello,
I agree, this could be improved. I already took a look at that specific enhancement, and tried to find a workaround. But the codebase of ACF is complex, and the JS part of the plugin is complicated aswell.
This fix cannot be implemented that easily, as that would require to twist the ACF base logic (which is always touchy) and would ask some extensive tests and bugfixes. The best solution would be that the ACF developer provide it out of the box. I may take a look at it again in the future, if I find the time.
Anyway, we’re talking about 20kb of css/js files once minified + gziped, it’s not that big. And having 10 files enqueued is not always better than having one which is bigger (in terms of cache/performance).
Have a nice day.
Regards.
Note: I’m closing the ticket if that’s alright for you. Feel free to submit a new topic if you need support.
Regards.
- The topic ‘reCaptcha v3’ is closed to new replies.