Quick Start

SDK (recommended)

Install the SDK and add one line of code.

bun add @requestguard/js

import RequestGuard from "@requestguard/js";

RequestGuard.captcha({
  el: ".rg-captcha",
  autoVerify: false,
  onVerify: (result) => {
    // The widget produced a token. Verify it on your backend before processing the form.
    document.getElementById("contact-send").disabled = !result.token;
  }
});

<div class="rg-captcha"></div>
<button id="contact-send" disabled>Send</button>

The SDK adds a hidden input named rg-captcha-token inside .rg-captcha. Submit that token with your form and verify it server-side before sending mail, creating an account, or completing another protected action.

Use autoVerify: false for normal contact forms and signup forms where your backend verifies the token. Leave autoVerify at its default (true) only when you want the browser to verify the token for UI gating and you will not verify the same token again on submit.

Live Demo

Send

Manual implementation

<script src="https://requestguard.com/js/captcha.js"></script>
<div class="rg-captcha"></div>
<button id="contact-send" disabled>Send</button>
<script>
  RequestGuard.captcha({
    el: ".rg-captcha",
    autoVerify: false,
    onVerify: (result) => {
      // The widget produced a token. Verify it on your backend before processing the form.
      document.getElementById("contact-send").disabled = !result.token;
    }
  });
</script>