GoogleReCaptchaProvider
Provider component for Google reCAPTCHA integration in React applications
<GoogleReCaptchaProvider
type
siteKey
language
scriptProps
isEnterprise
host
theme
explicit
onLoad
onError
>
{children}
</GoogleReCaptchaProvider>Props
Common Props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
type | 'v2-checkbox' | 'v2-invisible' | 'v3' | Yes | - | The type of reCAPTCHA to use |
siteKey | string | Yes | - | Your Google reCAPTCHA site key |
language | string | - | - | Language code for the reCAPTCHA widget |
scriptProps | GoogleReCaptcha.Script | - | - | Additional properties for the reCAPTCHA script |
isEnterprise | boolean | - | false | Whether to use reCAPTCHA Enterprise |
host | string | - | - | Custom host for the reCAPTCHA script |
theme | 'light' | 'dark' | - | light | Theme of the reCAPTCHA widget |
onLoad | (instance: ReCaptchaInstance) => void | - | - | Callback function when reCAPTCHA is loaded |
onError | () => void | - | - | Callback function when an error occurs |
v3 props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
explicit.badge | 'bottomright' | 'bottomleft' | 'inline' | - | - | Position of the reCAPTCHA badge |
explicit.tabIndex | number | - | - | Tab index for the reCAPTCHA widget |
explicit.callback | (token: string) => void | - | - | Callback when verification is successful |
explicit.errorCallback | () => void | - | - | Callback when reCAPTCHA encounters an error |
explicit.expiredCallback | () => void | - | - | Callback when the reCAPTCHA response expires |
v2 checkbox props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
explicit.container | string | Yes | - | Container ID for the reCAPTCHA widget |
explicit.action | string | - | - | Action name for the reCAPTCHA |
explicit.size | 'normal' | 'compact' | - | - | Size of the reCAPTCHA widget |
explicit.tabIndex | number | - | - | Tab index for the reCAPTCHA widget |
explicit.callback | (token: string) => void | - | - | Callback when verification is successful |
explicit.errorCallback | () => void | - | - | Callback when reCAPTCHA encounters an error |
explicit.expiredCallback | () => void | - | - | Callback when the reCAPTCHA response expires |
v2 invisible props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
explicit.badge | 'bottomright' | 'bottomleft' | 'inline' | - | - | Position of the reCAPTCHA badge |
explicit.tabIndex | number | - | - | Tab index for the reCAPTCHA widget |
explicit.callback | (token: string) => void | - | - | Callback when verification is successful |
explicit.errorCallback | () => void | - | - | Callback when reCAPTCHA encounters an error |
explicit.expiredCallback | () => void | - | - | Callback when the reCAPTCHA response expires |
Context values
| Property | Type | Description |
|---|---|---|
instance | ReCaptchaInstance | null | The reCAPTCHA instance. |
isLoading | boolean | Whether the reCAPTCHA script is still loading. |
language | string | The language code used for reCAPTCHA. |
siteKey | string | The site key used for reCAPTCHA. |
executeV3 | (action?: string) => Promise<string> | Executes reCAPTCHA v3 verification. Returns a promise that resolves to the verification token. |
executeV2Invisible | () => Promise<string> | Executes reCAPTCHA v2 invisible verification. Returns a promise that resolves to the verification token. |
reset | () => void | Resets the reCAPTCHA widget. |
getResponse | () => string | Gets the current reCAPTCHA response token. |
render | () => void | Renders the reCAPTCHA widget. |