JavaScript CAPTCHA Integration

Create a user account or log in with an existing one. Then create a new CAPTCHA or select an existing one. If you’re unsure whether TrustCaptcha is right for you, try our CAPTCHA service risk-free for 14 days at no cost.

On the CAPTCHA overview page, you will find all the important information, such as the site key, secret key and licence key. Allow your websites to access your CAPTCHA by simply adding them to the access authorised domain list in the CAPTCHA security rules.

The following steps give you a rough idea of how to integrate the TrustCaptcha CAPTCHA widget into an JavaScript frontend. For precise, detailed instructions, please read the CAPTCHA integration guide for JavaScript in our documentation.

First, install our TrustCaptcha JavaScript package:

ECMAScript Modules (esm)
<script type="module" src="https://cdn.trustcomponent.com/trustcaptcha/2.1.x/trustcaptcha.esm.min.js"></script>

CommenJS (cjs)
<script src="https://cdn.trustcomponent.com/trustcaptcha/2.1.x/trustcaptcha.cjs.min.js"></script>

Universal Module Definition (umd)
<script src="https://cdn.trustcomponent.com/trustcaptcha/2.1.x/trustcaptcha.umd.min.js"></script>

Now insert the CAPTCHA widget, the so-called trustcaptcha-component HTML tag, into any HTML form:

<form>
  <!-- your input fields -->
  <trustcaptcha-component
    sitekey="<your_site_key>"
  ></trustcaptcha-component>
  <!-- further input fields / submit button -->
</form>

<script>
  const trustcaptchaComponent = document.getElementsByTagName('trustcaptcha-component')[0];
  trustcaptchaComponent.addEventListener('captchaSolved', (event) => {
    console.log('Verification token:', event.detail); <!-- handle success -->
  });
  trustcaptchaComponent.addEventListener('captchaFailed', (event) => {
    console.error(event.detail); <!-- handle error -->
  });
</script>

The CAPTCHA widget will now be displayed on your JavaScript website:

Need detailed information about the JavaScript CAPTCHA integration?
For detailed instructions on integrating TrustCaptcha, please refer to our JavaScript CAPTCHA integration guide. A complete integration example for the JavaScript CAPTCHA can be found in our CAPTCHA Samples Repository on Github.

Other frontend technology instead of JavaScript?
If you do not want to use JavaScript or have several websites or applications, you can select a different framework or platform here. If there is no pre-built integration from us for your preferred frontend technology, your software developers can integrate the CAPTCHA themselves using our documentation or ask our support-team for a pre-built integration solution.

Once the CAPTCHA is complete, take the verification token and send it to your backend. In your backend, retrieve the CAPTCHA verification result from our servers and validate the result. Depending on how high the bot risk is, you decide how to proceed. You can find detailed information on backend integration and result validation in our documentation.

Prebuild backend integrations
You can use one of our pre-built integrations to integrate the CAPTCHA validation process into your backend service. If there is no pre-built integration from us for your preferred backend technology, your software developers can integrate the CAPTCHA themselves using using our documentation or ask our support-team for a pre-built integration solution.

You are now protected by TrustCaptcha - congratulations!