# @humanoids/react-native-recaptcha

> React native component to use the invisible recaptcha v3 from Google. Forked from @haskkor/react-native-recaptchav3.

Latest version **1.2.3** (published 2020-08-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install @humanoids/react-native-recaptcha
pnpm add @humanoids/react-native-recaptcha
yarn add @humanoids/react-native-recaptcha
bun add @humanoids/react-native-recaptcha
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.3 |
| Published | 2020-08-05 |
| First published | 2020-08-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 18.7 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Jeremy Farnault |
| Maintainers | robbinhabermehl, sabinewst |

## Links

- npm: https://www.npmjs.com/package/@humanoids/react-native-recaptcha
- Repository: https://github.com/humanoidsbv/react-native-recaptcha
- Homepage: https://github.com/humanoidsbv/react-native-recaptcha#readme
- Issues: https://github.com/humanoidsbv/react-native-recaptcha/issues
- npm.io page: https://npm.io/package/@humanoids/react-native-recaptcha

## Dependencies (1)

- [react-native-webview](https://npm.io/package/react-native-webview.md) ^9.0.1

## Recent versions

- 1.2.3 (latest) — 2020-08-05
- 1.2.2 — 2020-08-04

## README

# @humanoids/react-native-recaptcha

This package is forked from `@haskkor/react-native-recaptchav3`. Refreshing the reCAPTCHA v3 token caused the following error:

```
Error evaluating injectedJavaScript: This is possibly due to an unsupported return type. Try adding true to the end of your injectedJavaScript string.
```

Also, `originWhitelist` needed to be specified. Fixes for these two issues have been applied.

Below you will find the original README with updated code snippets.

# react-native-recaptcha

[![npm](https://img.shields.io/npm/v/@humanoids/react-native-recaptcha.svg)](https://www.npmjs.com/package/@humanoids/react-native-recaptcha) [![npm](https://img.shields.io/npm/dt/@humanoids/react-native-recaptcha.svg)](https://www.npmjs.com/package/@humanoids/react-native-recaptcha)

_React native component to use the invisible reCAPTCHA v3 from Google_

https://www.google.com/recaptcha/intro/v3.html

## Installation

```
npm install --save @humanoids/react-native-recaptcha
```

or

```
yarn add @humanoids/react-native-recaptcha
```

**Note:** React Native Community Webview requires you to link the native dependencies (https://github.com/react-native-community/react-native-webview/blob/master/docs/Getting-Started.md)

## Demo

![automatic](https://user-images.githubusercontent.com/10620919/48578194-e1022c80-e97d-11e8-8bb9-6e96a8a25aec.gif) ![retrybutton](https://user-images.githubusercontent.com/10620919/48578212-ed868500-e97d-11e8-95ab-1d5ec0280b8f.gif)

## Usage

Automatically get a captcha token:

```
import ReCaptchaV3 from '@humanoids/react-native-recaptcha'

<ReCaptchaV3
  captchaDomain={'https://yourowndomainname.co.nz'}
  siteKey={'yourownsitekey'}
  onReceiveToken={(token: string) => Alert.alert('CAPTCHA', token)}/>
```

One could also use a trigger to request a new token using the reference of the component:

```
import ReCaptchaV3 from '@humanoids/react-native-recaptcha'

<ReCaptchaV3
  ref={(ref: RecaptchaV3) => this._captchaRef = ref}
  captchaDomain={'https://yourowndomainname.co.nz'}
  siteKey={'yourownsitekey'}
  onReceiveToken={(token: string) => Alert.alert('CAPTCHA', token)}/>

<TouchableOpacity onPress={() => this._captchaRef.refreshToken()}>
  <Text>Retry</Text>
</TouchableOpacity>
```

## Options

| Key                  | Description                                                   | Default | Required | Type                             |
| -------------------- | ------------------------------------------------------------- | ------- | -------- | -------------------------------- |
| **`captchaDomain`**  | Your url registered with Google reCAPTCHA                     | `None`  | `true`   | `string`                         |
| **`onReceiveToken`** | The callback used to get the captcha token from the component | `None`  | `true`   | `(captchaToken: string) => void` |
| **`siteKey`**        | The site key provided by Google reCAPTCHA                     | `None`  | `true`   | `string`                         |

## [Changelog](https://github.com/humanoidsbv/react-native-recaptcha/blob/master/CHANGELOG.md)

## Contributing

Pull requests are welcome.

## [License](https://github.com/humanoidsbv/react-native-recaptcha/blob/master/LICENSE)

---
_Source: https://npm.io/package/@humanoids/react-native-recaptcha · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
