Implemented Include Cloudflare "Turnstile" as a CAPTCHA Option

DeltaHF

Well-known member
Today, Cloudflare announced Turnstile, a CAPTCHA alternative designed to be easier (for humans, at least) to use.


It is implemented in a similar way to reCAPTCHA and hCAPTCHA, it is available for free, and any website can use it, even if they aren't using Cloudflare.

I like that Turnstile is effortless for users, but more importantly, it's not widely adopted yet. This will make it less likely to be abused by spammers, and could help us keep our XenForo communities free from spam and abuse.
 
Upvote 11
This suggestion has been implemented. Votes are no longer accepted.

digitalpoint

Well-known member
Just FYI, I've already added it to my Cloudflare addon (it's part of 1.3.0, which isn't released yet).

It seems to be working as expected so far, but I'm going to let it run for a bit on my site to make sure there's no unforeseen issues before releasing it.

1664413579914.png

It's using XenForo's normal CAPTCHA handler system so anywhere (even non-standard places) that a site is using XenForo's CAPTCHA system, it should work. It currently supports both light and dark themes.

You can see it in action here: https://iolabs.io/register
 

Chris D

XenForo developer
Staff member
Fair enough. I want to make some changes to the captcha system overall so we can add context to the captcha being performed as I think Cloudflare let’s us log that and be seen in analytics.
 

The Dark Wizard

Well-known member
I think this is fantastic, things that improve the user experience (and not cost privacy, as far as I can tell from what they announced) is always a plus in my book.

However, from a quick search, what situations trigger a user to fail, and what is their recourse? At-least with click captchas, they can try again and get different images if they mess up.

@Chris D
 

digitalpoint

Well-known member
Fair enough. I want to make some changes to the captcha system overall so we can add context to the captcha being performed as I think Cloudflare let’s us log that and be seen in analytics.
Ya... the action parameter allows you to do it. If you end up not implementing action yourself, it would be nice if your JavaScript just did this:

JavaScript:
var options = this.options;
...instead of this:
JavaScript:
var options = {
    sitekey: this.options.sitekey,
    theme: this.options.theme,
};

That would allow others to use the data-action attribute (or other available parameters since we aren't boxed into just sitekey and theme).
 

Nicolas FR

Well-known member
However, from a quick search, what situations trigger a user to fail, and what is their recourse? At-least with click captchas, they can try again and get different images if they mess up.
Good question, i just tested here and i passed the test but in case of fail what's happen ?
 

Chris D

XenForo developer
Staff member
@digitalpoint with your implementation, if you happen to have a template that contains two forms where each of those forms displays a captcha, does it double render for you also?

Disabled it on the XF site for now but this post shows what was happening to our contact form:

It's showing twice on the contact us page.

View attachment 274047

The other captchas don't do this so thinking it's potentially a CF bug. It renders two captchas in each tab 🙃
 

digitalpoint

Well-known member
@digitalpoint with your implementation, if you happen to have a template that contains two forms where each of those forms displays a captcha, does it double render for you also?

Disabled it on the XF site for now but this post shows what was happening to our contact form:



The other captchas don't do this so thinking it's potentially a CF bug. It renders two captchas in each tab 🙃
I don't have anything that has 2 different forms each with captchas (I don't use captchas for anything beyond the default places XenForo uses them).

In the case of your contact form, since it's not the standard contact form, maybe it makes sense to have your piracy tab actually be a different URL rather than load both forms in on a single page as a workaround (simple enough with XenForo as you are well aware.. haha)? 🤷‍♂️

Even though it would be nice if it supported multiple captchas on a single page, it probably makes more sense to not use it that way anyway because your captcha analytics will get skewed where you get 2x visitor solve rates per page view, but the potential for only a single API solve (user is only going to submit one of the forms).

Either way, I haven't tried loading in 2 different captcha solves on a single page, but I'm guessing it wouldn't work for me either.
 

digitalpoint

Well-known member
I hope you will still release yours for those of us already using your awesome addon and not using the latest Xen Foro version.
I'm not going to include the basic Turnstile functionality (no point in adding what will already be in XenForo), but I am adding the ability to automatically set it up/configure it via backend Cloudflare API calls with a single button click. Also adding buttons for deep links into your Cloudflare account for things like analytics. The addon will wedge in a Setup in Cloudflare button to XenForo's implementation that will trigger an overlay like so:

1664476099228.png

...confirming that will automatically create the Turnstile site in Cloudflare and populate the keys in XenForo's settings:

1664476196418.png
If you already have the Turnstile site setup in Cloudflare (it checks via the API), it will give you two buttons (Settings and Analytics) that deep link into your Cloudflare account.

At this point, I'm just waiting on the next version of XenForo.
 

Chris D

XenForo developer
Staff member
The <xf:captcha tags are now context aware so the context can be passed into the CAPTCHA provider for analytics.

1664981952334.png

The "No Action" category is captcha tags that do not include a context and we have quite a lot as we ran this for just under a week until we added that. The others are coming from updates we've made to templates in XF 2.2.11.

We've just given each captcha tag usage a context that more or less matches what template it is called in, so this should apply for all default captchas from 2.2.11 forwards.

I have no idea if other captcha providers have the ability to denote actions/context but currently only Turnstile is supported for this.
 

digitalpoint

Well-known member
The <xf:captcha tags are now context aware so the context can be passed into the CAPTCHA provider for analytics.

View attachment 274429

The "No Action" category is captcha tags that do not include a context and we have quite a lot as we ran this for just under a week until we added that. The others are coming from updates we've made to templates in XF 2.2.11.

We've just given each captcha tag usage a context that more or less matches what template it is called in, so this should apply for all default captchas from 2.2.11 forwards.

I have no idea if other captcha providers have the ability to denote actions/context but currently only Turnstile is supported for this.
Sexy... that's one more Turnstile thing I can remove from my add-on. 👍🏻 I think at this point the only Turnstile stuff my add-on adds is the ability to auto create/configure the Turnstile site via API without needing to go to Cloudflare.

The major CAPTCHA systems (hCaptcha and reCAPTCHA) don't support the action attribute (or anything similar). But Turnstile is really good, so at this point I'm not sure why anyone would want to use anything else anyway. :)
 
Top