@haskkor/react-native-recaptchav3

React native component to use the invisible reCAPTCHA v3 from Google
https://www.google.com/recaptcha/intro/v3.html

Installation

npm install --save @haskkor/react-native-recaptchav3

or

yarn add @haskkor/react-native-recaptchav3

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

Usage

Automatically get a captcha token:

import ReCaptchaV3 from '@haskkor/react-native-recaptchav3'

<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 '@haskkor/react-native-recaptchav3'

<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

Contributing

Pull requests are welcome.

License