Google reCAPTCHA v3 comes in three different tiers. This article focuses on the integration of the Essentials tier, as it is free to use. The integration shown below basically also works with the Standard and Enterprise tiers, but you might add a custom connector and SSBO, to use Enterprise REST API with API keys instead.
To use Google reCAPTCHA v3, you need to:
Add the Captcha-Widget to the screen in your application, which should be protected by Google reCAPTCHA v3.
At least the following configuration of the Widget’s properties is required:
| Property | Value | Description |
|---|---|---|
| ID | Default: Captcha1 | Adapt the ID as required to easily identify it in all places like Process Designer |
| captchaType | reCAPTCHA v3 | – |
| action | Default: submit | Define any action name you want to use |
| siteKey | <Your Google Site Key> | Enter the reCAPTCHA site key, you created (see Prerequisites) |
| badgeVisible | true|false | Google allows you to hide the reCAPTCHA badge as long as you include the reCAPTCHA branding visibly in the user flow. (Read more). If you hide the badge, you have to add the branding manually. |
Now we need to know when Google has rated the Captcha and the score can be analyzed within your backend process. Therefore add a new Story in Process Designer (e.g. ‘Send form’), subscribe to the ‘validationFinished’ Event of your Captcha-Widget, and trigger the Server-Side Business Object Function, that executes the further process.
In our case, we call a demo Server-Side Business Object Function and show a message toast on success.
It is important to handover the value of the Captcha’s property ‘resultToken’ in the input mapping. This token is required to get the score from Google.
To validate the score within the Server-Side Business Object, call the function ‘verifySite’ of our Standard Server-Side Business Object ‘SF_reCAPTCHA’. The payload requires the result token handed over in input mapping and your secret key that was created with your Google site key. (See Prerequisites)
In the Essentials tier, the score can have one of the following 4 values: 0.1, 0.3, 0.7, 0.9. The higher the value, the more likely a human executed the action. In our demo case, we are first checking the scoring’s success and then analyzing the score. As an example, we are throwing an error, if the score is lower than 0.9.
Adapt the analysis as required and add your process logic after the check.
Deploy and the Captcha is integrated
