v2 сheckbox

Demo

Provider Setup

All reCAPTCHA functionality requires wrapping your application with the GoogleReCaptchaProvider. This provider manages the reCAPTCHA script loading and provides context to child components.

import React from 'react';
import { GoogleReCaptchaProvider } from '@google-recaptcha/react';

export const App = () => (
  <GoogleReCaptchaProvider type='v2-checkbox' siteKey='your_site_key'>
    ...
  </GoogleReCaptchaProvider>
);

Usage

When a user interacts with the Google ReCaptcha v2 checkbox, advanced algorithms analyze their behavior to distinguish between humans and bots. If the system suspects suspicious activity, additional challenges may be presented, such as image selections or puzzle-solving tasks.

import React from 'react';
import { GoogleReCaptchaCheckbox } from '@google-recaptcha/react';

const App = () => <GoogleReCaptchaCheckbox onChange={(token) => console.log(token)} />;

Enterprise Mode

Google reCAPTCHA Enterprise provides enhanced security features, advanced analytics, and better customization options for businesses. It offers improved bot detection, detailed risk analysis, and enterprise-grade support.

<GoogleReCaptchaProvider type='v2-checkbox' siteKey='your_enterprise_site_key' isEnterprise>
  <App />
</GoogleReCaptchaProvider>

After enabling enterprise mode, you can use the GoogleReCaptchaCheckbox component to set the action for the checkbox.

import React from 'react';
import { GoogleReCaptchaCheckbox } from '@google-recaptcha/react';

const App = () => (
  <GoogleReCaptchaCheckbox
    action='some action'
    onChange={(token) => console.log(token)}
  />
);