Nonconformist Propaganda Machine

    react-use-recaptcha-v3
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.2 • Public • Published

    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

    simplest way:
    import React from 'react'
    import { useReCaptcha } from 'react-use-recaptcha-v3';
     
    const UncontrolledGoogleReCaptcha = () => {
      const siteKey = '[SET UP YOU SITE KEY HERE!!!]';
      const { token } = useReCaptcha(siteKey);
     
      return (
        <form>
          {/* other fields here */}
          {token ? <input name="g-recaptcha" value={token} /> : null}
        </form>
      );
    };
     
    recommended way:
    import React, { useState } from 'react';
    import { useReCaptcha } from 'react-use-recaptcha-v3';
     
    const ControlledGoogleReCaptcha = () => {
      const [token, setToken] = useState();
     
      const handleToken = (tokenFromGoogleResponse) => {
        console.log('fresh token is appear here, each time actionName is changed', { tokenFromGoogleResponse });
        setToken(tokenFromGoogleResponse);
      };
     
      const siteKey = '[SET UP YOU SITE KEY HERE!!!]';
      const actionName = 'submit'; // you can change actionName here if you need
     
      useReCaptcha(siteKey, handleToken, actionName);
     
      return (
        <form>
          {/* other fields here */}
          {token ? <input name="g-recaptcha" value={token} /> : null}
        </form>
      );
    };

    Install

    npm i react-use-recaptcha-v3

    DownloadsWeekly Downloads

    2

    Version

    2.0.2

    License

    MIT

    Unpacked Size

    17 kB

    Total Files

    18

    Last publish

    Collaborators

    • altiore