dozoisch / dozoisch/react-google-recaptcha
Error thrown from executeAsync() and onErrored event
- Dominant language
- JavaScript
- Stars
- 1.1k
- Forks
- 148
- PR merge metrics
- No merged PRs in 30d
Description
- react-google-recaptcha version: 3.1.0
- react-async-script version: n/a
- react: 17.0.2
- next.js: 12.2.5
- formik: 2.29
- yup: 0.29.3
Can someone tell me if the problem I have is due to me not having react-async-script installed in my application? Is this a dependency I'll need to install? It's not mentioned anywhere in the docs as far as I know.
Any help with this problem would be great.
I have checked thoroughly to make sure my API key has been configured and implemented correctly
1. When a user clicks the Next button the code below runs and an error is thrown. The error being logged is undefined though.
```js
const _recaptchaRef = useRef(null);
const handleNext = async () => {
let reCaptchaToken;
try {
reCaptchaToken = await _recaptchaRef.current.executeAsync();
} catch (error) {
// error gets thrown here
console.log('handleNextAction > reCaptcha error:', error);
}
if (reCaptchaToken) {
// execute code
} else {
if (_recaptchaRef.current) {
_recaptchaRef.current.reset();
}
}
};
```
2. The onErrored event is firing continuously and just logging an empty array.
```jsx
{
console.log('reCaptcha asyncScriptOnLoad:', value);
}}
onErrored={(...errorArgs) => {
if (_recaptchaRef.current) {
console.log(
'reCaptcha onErrored args:',
errorArgs
);
_recaptchaRef.current.reset();
}
}}
onExpired={() => {
if (_recaptchaRef.current) {
console.log('reCaptcha onExpired');
_recaptchaRef.current.reset();
}
}}
/>
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.