react-use-recaptcha-v3

Integration Google reCaptcha with React hooks.

Google ReCaptcha V3 with React Hooks

Installation

npm install react-use-recaptcha-v3 --save

Usage

1. Get your site key for ReCaptcha V3

2. Implement Back End side

3. Use this package to send google re-captcha token to you Back End verifier

RECOMMENDED:

const ControlledGoogleReCaptcha = () => {
  const siteKey = '[SET UP YOU SITE KEY HERE!!!]';
  const actionName = 'submit'; // you can change actionName here if you need

  const { execute } = useReCaptcha(siteKey, actionName);

  const submitForm = async () => {
    const token = await execute();
    // submit you form with token
  };

  return <form>[ANY FORM HERE]</form>;
};

@ALTERNATIVE with redux-form:

const GReCaptchaReduxFormField = ({ input: { onChange } }) => {
  const siteKey = '[SET UP YOU SITE KEY HERE!!!]';
  const actionName = 'submit'; // you can change actionName here if you need

  useReCaptcha(siteKey, actionName, onChange);

  return null;
};