Documentation AEM as a Cloud Service User Guide

Connect your AEM Forms environment with Turnstile connect-your-forms-environment-with-turnstile-service

Last update: Thu Dec 19 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

CREATED FOR:

User
Developer

This feature is under the Early Adopter Program. You can write to aem-forms-ea@adobe.com from your official email id to join the early adopter program and request access to the capability.

CAPTCHA (Completely Automated Public Turing test to tell Computers and Humans Apart) is a program commonly used in online transactions to distinguish between humans and automated programs or bots. It poses a challenge and evaluates user response to determine if it’s a human or a bot interacting with the site. It prevents the user to proceed if the test fails and helps make online transactions secure by keeping bots from posting spam or malicious purposes.

AEM Forms as a Cloud Service supports the following CAPTCHA solutions:

Integrate AEM Forms environment with Turnstile Captcha

Cloudflare’s Turnstile Captcha is a security measure that aims to protect forms and sites from automated bots, malicious attacks, spams and unwanted automated traffic. It presents a checkbox on form submission to verify that they are human, before allowing them to submit the form. AEM Forms as a Cloud Service supports Turnstile Captcha in Adaptive Forms Core Components.

Prerequisites to integrate AEM Forms environment with Turnstile Captcha prerequisite

To configure Turnstile for AEM Forms Core Components, you need to obtain the Turnstile sitekey and secret key from the Turnstile website.

Configure Turnstile steps-to-configure-hcaptcha

To integrate AEM Forms with the Turnstile service, perform the following steps:

Create a Configuration Container on your AEM Forms as a Cloud Service environment. A Configuration Container holds Cloud Configurations used to connect AEM to external services. To create and configure a Configuration Container to connect your AEM Forms environment with Turnstile, follow the steps given below:
1. Open your AEM Forms as a Cloud Service instance.
2. Go to Tools > General > Configuration Browser.
3. In the Configuration Browser, either create a new folder and enable Cloud Configurations for it or enable Cloud Configurations for an existing folder as explained below:
  - To create a new folder and enable the Cloud Configurations for it by following the steps:
    1. In the Configuration Browser, click Create.
    2. In the Create Configuration dialog, specify a name, title, and select the Cloud Configurations option.
    3. Click Create.
  - To enable the Cloud Configurations option for an existing folder:
    1. In the Configuration Browser, select your existing folder and click Properties.
    2. In the Configuration Properties dialog, enable Cloud Configurations.
    3. Click Save & Close to save the configuration and exit.

Configure the Cloud Service:

On your AEM author instance, go to > Cloud Services and click Turnstile.
Select a Configuration Container, created or updated, as described in the previous section. Select Create.
Specify Widget Type as managed, non-interactive or invisible. To know more about Widget Type, visit Turnstile Widget.
Specify Title, Name, Site Key, and Secret Key for Turnstile service obtained in the prerequisite.
Click Create.

note note
NOTE
Users need not to modify Client-side JavaScript validation URL and Server-side validation URL as they are already prefilled for Turnstile validation.

Once the Turnstile Captcha service is configured, it is available for use in an Adaptive Form based on Core Components.

Use Turnstile in an Adaptive Form using-turnstile-core-components

Open your AEM Forms as a Cloud Service instance.
Go to Forms > Forms and Documents.
Select your Adaptive Form and click Properties. In the Configuration Container section, select the Configuration Container that contains the Cloud Configuration which connects AEM Forms with Turnstile.
Click Save & Close.

If you do not have a Configuration Container, see section Configure Turnstile to learn how to create a Configuration Container.
Select an Adaptive Form and click Edit to open a form in the editor.
From the component browser, drag-drop or add the Adaptive Form Turnstile component onto the adaptive form.

Select the Adaptive Form Turnstile component and click properties icon. It opens the properties dialog. Specify the following properties:

Turnstile v2

Name: Specify the name for your Captcha component, you can identify a form component easily with its unique name both in the form and in the rule editor.
Title: Specify the title for your Captcha component. you can allow Rich Text for the title and also you can hide the title, by ticking the checkboxes.

Configuration Settings: Select a Cloud Configuration configured for Turnstile Captcha service.

note note
NOTE
You can have multiple Cloud Configurations in your environment for a similar purpose. So, choose the service carefully. If no service is listed, see the section, Configure Turnstile, to learn how to create a Configuration Container to connect your AEM Forms environment with Turnstile service.

Validation: Provide Captcha validation in the form of an error message:

Error Message: Provide the error message to display to the user when the Captcha submission fails.

note note
NOTE
An error message appears only if the CAPTCHA is filled on the client side.

Click Done.

Now, only legitimate forms, in which the form filler successfully clears the challenge posed by the Turnstile service are allowed for the form submission.

Turnstile Challenge

Frequently Asked Questions

Q: Can I use more than one Captcha component in an Adaptive Form?
Ans: Using more than one Captcha component in an Adaptive Form is not supported. Also, it is not recommended to use a Captcha component in a fragment or a panel marked for lazy loading.