# reCAPTCHA for React [![License MIT](https://img.shields.io/badge/licence-MIT-blue.svg)](https://github.com/douglasjunior/react-recaptcha-that-works/blob/master/LICENSE) [![npm version](https://img.shields.io/npm/v/react-recaptcha-that-works.svg)](https://www.npmjs.com/package/react-recaptcha-that-works) [![npm downloads](https://img.shields.io/npm/dt/react-recaptcha-that-works.svg)](#install) A reCAPTCHA library for React that works. _Looking for [React Native version](https://github.com/douglasjunior/react-native-recaptcha-that-works)?_ ## Install ### Install the module ```bash yarn add react-recaptcha-that-works ``` Or ```bash npm i -S react-recaptcha-that-works ``` ### Import the reCAPTCHA script ```html ... ``` ## Usage ### I'm not a robot ```jsx import React, { Component } from 'react'; import Recaptcha from 'react-recaptcha-that-works'; class App extends Component { send = () => { console.log('send!', this.state.token); } onVerify = token => { console.log('success!', token); this.setState({ token }); } onExpire = () => { console.warn('expired!'); } render() { return (

) } } ``` ### Invisible ```jsx import React, { Component } from 'react'; import Recaptcha from 'react-recaptcha-that-works'; class App extends Component { send = () => { console.log('send!'); this.recaptcha.execute(); } onVerify = token => { console.log('success!', token); } onExpire = () => { console.warn('expired!'); } render() { return (

) } } ``` ### TypeScript ```tsx import React, { useRef } from 'react'; import Recaptcha, { RecaptchaRef } from "react-recaptcha-that-works"; // ... export const Component: React.FC = () => { const recaptcha = useRef(null); const send = () => { console.log('send!'); recaptcha.current?.execute(); }; const onVerify = (token: string) => { console.log('success!', token); }; const onExpire = () => { console.warn('expired!'); } return (

); }; ```
For more details, see the [Sample Project](https://github.com/douglasjunior/react-recaptcha-that-works/blob/master/src/App.tsx). ## Props |Name|Value|Default|Description| |-|-|-|-| |siteKey|||Your sitekey.| |size|`'invisible'`, `'normal'` or `'compact'`|`'normal'`|The size of the widget.| |theme|`'dark'` or `'light'`|`'light'`|The color theme of the widget.| |onLoad|`function()`||A callback function, executed when the reCAPTCHA is ready to use.| |onVerify|`function(token)`||A callback function, executed when the user submits a successful response. The reCAPTCHA response token is passed to your callback.| |onExpire|`function()`||A callback function, executed when the reCAPTCHA response expires and the user needs to re-verify.| |onError|`function()`||A callback function, executed when reCAPTCHA encounters an error (usually network connectivity) and cannot continue until connectivity is restored. If you specify a function here, you are responsible for informing the user that they should retry.| |onClose|`function()`||(Experimental) A callback function, executed when the challenge window is closed.| ## React Ref Methods |Name|Type|Description| |-|-|-| |execute|`function`|Executes the challenge in "invisible" mode.| |reset|`function`|Resets the reCAPTCHA state.| ## reCAPTCHA v2 docs - [I'm not a robot](https://developers.google.com/recaptcha/docs/display) - [Invisible](https://developers.google.com/recaptcha/docs/invisible) ## Contribute New features, bug fixes and improvements are welcome! For questions and suggestions, use the [issues](https://github.com/douglasjunior/react-recaptcha-that-works/issues).

[![Donate](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=E32BUP77SVBA2) ## License ``` The MIT License (MIT) Copyright (c) 2018 Douglas Nassif Roma Junior ``` See the full [license file](https://github.com/douglasjunior/react-recaptcha-that-works/blob/master/LICENSE).

	Stars	Issues	Version	Updated	Created
react-recaptcha-google			1.1.1	6 years ago	6 years ago
react-recaptcha-that-works			2.0.1	8 months ago	6 years ago
recaptcha			1.2.1	9 years ago	13 years ago
recaptcha-verify	2	0	0.1.1	7 years ago	10 years ago

react-recaptcha-google vs react-recaptcha-that-works vs recaptcha vs recaptcha-verify

Downloads in past1 Month3 Months6 Months1 Year2 Years5 YearsAll time

Stats

Popular Searches

Sick of boring JavaScript newsletters?

Downloads in past