I am trying to understand how these two widget types behave.
Ideally I would like to deploy the widget such that it is invisible but if it fails the invisible checks then the widget is shown and the user is requested to click the button etc.
However what I experience:
We faced the same problems. However, we solved this by adding two captchas (one managed variant and one invisible) and loading the invisible widget on page load. On submit, we check whether the widget has been solved. If it’s not solved, we are loading the managed captcha and submit the form as soon as the managed variant is solved.
Thanks, will give this a try. Hopefully this behaviour is added as a configuration option in future
Thanks for posting this! We’re working on our first Turnstile implementation and were confronted with the same issue described in this thread. In your case, since you check the invisible widget to see if it’s solved on submit, I presume that interrupts the submit process entirely, right? I just want to make sure I understand what’s going on.
Thanks for the tip!
The way we do it is to use a managed widget, but keep it hidden by default (you can just place it in a div with display:none). When the user submits the form we check if the captcha value is present (usually it is – no interaction was needed) and copy the value into a hidden field in our form. If not present, we display the widget (it’s either still loading if the user submitted really fast, in which case is works like a progress bar, or it requires the user to click it in which case it needs to be shown). The vast majority (90%+) of users never know it’s there.
Interesting. So, when you show the div with the managed widget that needs user input, it’s already showing the “Verify you’re a human” check-box?
Yes that is correct – in most cases when displaying the captcha it will already be in the “Verify you’re a human” checkbox state. We use the captcha for sign up. The basic idea is to have the captcha in a hidden dialog box that says something like “Complete the captcha to finish sign up”. When the user submits the sign up form, we display the dialog box / captcha if the captcha hasn’t completed on its own yet.
Great! Thanks for the info!
Yes exactly! I call preventDefault() on the Submit-Button and submit it manually on solving the captcha.
Thats a nice way as well! However, I hope that there are no bugs in the future with solving the captcha when it is not displayed.
Great! Thanks for the clarification!
This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.