Skip to main content
Contact Support

Using Captcha to Protect Forms and Payments

Ryan J.
Updated

Captcha fields are used to add a layer of security to your forms and prevent illegitimate submissions. 

Types of Captcha

We allow Captcha protection to be added in three ways. 

  1. Google reCAPTCHA v3 [🔺Recommend Option]
    Form setting that uses Google reCaptcha v3 to assign a score to the user and block illegitimate submissions.

    hero-recaptcha-invisible.gif
     
  2. Visible Captcha Field
    Form field that requires the user to complete a short challenge before submission.

    image-2.png
     
  3. Visible Captcha Field on NativeCloud
    On NativeCloud, the visible captcha field implementation uses Google reCAPTCHA v2 (checkbox) type. We strongly recommend using Google reCAPTCHA v3 instead as it is easier to use and more powerful.

    newCaptchaAnchor.gif

🔺 If both Visible Captcha field and Google reCAPTCHA v3 are enabled in your form then both must pass to allow submission.  

 

How to Set up Google reCAPTCHA v3

💡 Supported on all plans. We use Google reCAPTCHA v3 and this is available on all plans including NativeCloud.

 

Step 1: Add domain into Google reCAPTCHA admin site.

https://www.google.com/recaptcha/admin/

  • If using a Formstack hosted form, you will need to add formstack.io. 
  • If using a NativeCloud hosted form on your Force.com site, you will need to add the domain of your force.com site or the custom domain associated to it.
  • If the form is embedded elsewhere, then the domain name will be where it is hosted. 

 

Step 2: Add Remote Site Setting 

Since NativeCloud forms are hosted from Force.com site we need to allow our app to communicate with Google to make reCAPTCHA v3 work. 

>> Go to Salesforce Setup > Remote Site Settings > New Remote Site (button)

  • Remote Site Name: Google_Captcha
  • Remote Site URL: https://www.google.com
  • Disable Protocol Security: Unchecked
  • Description: Captcha for Formstack Forms.
  • Active: True

 

Step 3: Set up Google reCAPTCHA Integration

>> Go to Admin Settings > Integration Credentials > Open Google reCAPTCHA V3 integration

recaptchaintegration.png

Review Google’s guide for more information about setting up your reCAPTCHA v3 integration.
https://developers.google.com/recaptcha/docs/v3#interpreting_the_score 

 

Step 4: Enable Google ReCAPTCHA on form

>> Open a Form > Go to Form Settings > enable Google reCAPTCHA.

 recaptchav3.png

To add the CAPTCHA option your form, look under General Fields towards the right side of the builder. Either double-click on the captcha field or drag and drop the field onto your form. Publish your form.

 

Step 5 - Community Forms only: Configure Community Script Security

See instructions at https://help.salesforce.com/articleView?id=networks_security_csp_scriptlevel.htm&type=5
 

  1. Navigate to your Community Site Builder >> Settings >> Security 
  2. Set script security level to “Allow Inline Scripts and Script Access to Allowed Third-party Hosts” 
  3. Add URLs of Trusted Sites for Scripts (2 sites): 

 

 

🔺reCAPTCHA for Payments

If you have a payment field on your form and Google reCAPTCHA v3 is enabled, then payments must also pass the background reCAPTCHA challenge before we send the payment request to your payment provider. This allows us to prevent programmatic testing of stolen credit cards that may skip user access of forms. We recommend using the E-Commerce Action and a score of 0.9.

 

 

Visible Captcha Field

  1. Add Captcha Field

>> Open a Form > Go to Form Editor > Add Captcha field

recaptchafield.png 

 

image-1.png


💡 Rules can be used to conditionally manipulate Captcha fields. 

 

Visible Captcha Field on NativeCloud

On NativeCloud, the implementation uses Google reCAPTCHA v2 (checkbox) type and the setup requires a few steps in addition to adding the field to the form as described above. 

 

  1. Add Remote Site Setting 

Since NativeCloud forms are hosted from Force.com site we need to allow our app to communicate with Google to make reCAPTCHA v2 work. 

 

>> Go to Salesforce Setup > Remote Site Settings > New Remote Site (button)

  • Remote Site Name: Google_Captcha
  • Remote Site URL: https://www.google.com
  • Disable Protocol Security: Unchecked
  • Description: Captcha for Formstack Forms.
  • Active: True


 

Optional: Use your own Google reCAPTCHA v2 account

By default we use Formstack’s Google reCAPTCHA v2 account and this is configured for force.com sites. 

 

There are a few cases where you will need to use your own Google reCAPTCHA account. 

  • If you want to use your own account for any reason
  • If your Force.com site that serves forms for NativeCloud uses a custom domain
  • If you embed the form on a page with a domain other than *.force.com

 

In these cases you must configure additional settings to use your own Google reCAPTCHA account..

 

💡You are presented with steps to supply your Google reCAPTCHA v2 keys during initial NativeCloud Setup Helper screens so you may have set these settings up already. It’s good to revisit these steps if you are experiencing issues. 

 

1. Create your captcha account if needed at https://www.google.com/recaptcha/admin#list 

recaptchav2.png

 

2. Add the domains of your force.com or Community site (if using custom domain) or where your form will be embedded.


If you see the following error then double check that your domains are properly set up in Google.

nccaptchaerror.png


3. Add reCAPTCHA Secret and Site keys
>> Go to Salesforce Setup > Custom Settings 

  • On Formstack Auth click on Manage
  • Click Edit on FastFormsNativeApp
  • Fill ReCaptcha Secret Key with the Secret from Google 
  • Fill ReCaptcha Site Key with the Site Key from Google 

 

Related articles