EU CAPTCHA for React

Frequently Asked Questions

• How do I add EU CAPTCHA to a React application?

  Install the package with npm i @myrasec/eu-captcha. Import { EuCaptcha, isEuCaptchaDone } from '@myrasec/eu-captcha' and place <EuCaptcha sitekey={sitekey} /> inside your form component. Call isEuCaptchaDone() in your submit handler and send the eu-captcha-response token to your backend API for server-side verification.

• Does EU CAPTCHA work with React functional components and hooks?

  Yes. The @myrasec/eu-captcha package is a standard React component that works with functional components and hooks. You can use useState for form state, useRef to access the widget element if needed, and the provided onComplete, onExpired, and onError callback props to react to widget lifecycle events.

• Does EU CAPTCHA work with React 18 and concurrent mode?

  Yes. EU CAPTCHA is a self-contained React component that operates independently of concurrent mode, Suspense boundaries, or transitions. The widget initialises once the DOM node is available and does not interfere with React's rendering pipeline.

• Can I use EU CAPTCHA in a React SPA with client-side routing?

  Yes. Since the EuCaptcha component follows standard React component lifecycle rules, it reinitialises each time it mounts. When navigating between routes with React Router or similar libraries, the widget will automatically reinitialise on each mount. Use a key prop tied to the route if you need to force a fresh reinitialisation.

• How do I defer or manually trigger the EU CAPTCHA challenge?

  Set autostart={false} on the EuCaptcha component and provide a widgetId prop. When you are ready to trigger the challenge — for example, when the user clicks submit — call window.euCaptcha.execute(widgetId). This is useful for multi-step forms where you want to delay the challenge until the final submission.

• Is EU CAPTCHA GDPR compliant for React applications?

  Yes. EU CAPTCHA is operated by an EU-based company, is hosted entirely in Germany, and does not rely on US cloud providers or infrastructure subject to US surveillance laws. The service processes only the data necessary to provide and verify the CAPTCHA (such as IP address and technical browser or device information) in line with the requirements of the GDPR. Your organization remains responsible for providing transparent privacy information, selecting an appropriate legal basis, and obtaining any required consent for your specific React implementation. This information does not constitute legal advice; please consult your legal counsel for an assessment of your individual case.

• How do I send the CAPTCHA token from React to my backend?

  When the challenge completes, the widget creates a hidden input named eu-captcha-response. Read its value using document.querySelector('input[name="eu-captcha-response"]')?.value and include it in your fetch or axios request body. Your backend validates the token against the EU CAPTCHA API with your secret key before processing the form.