You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hi. Thanks for your lib! I am using this library to login flow and register flow. Everything works fine when the user action is slow, so the user clicks on register, the flow runs ok without Execute recaptcha not yet available
This is my HOC
<GoogleReCaptchaProvider
reCaptchaKey={process.env.REACT_APP_RECAPTCHA_SITE_ID}
language={language}
useRecaptchaNet={false}
useEnterprise={false}
scriptProps={{
async: false, // optional, default to false,
defer: false, // optional, default to false
appendTo: "head", // optional, default to "head", can be "head" or "body",
nonce: undefined, // optional, default undefined
}}
>
<App />
</GoogleReCaptchaProvider>
This is my Register button click:
if (!executeRecaptcha) {
console.log(Execute recaptcha not yet available');
return;
}
const recaptcha = await executeRecaptcha("Register");
This runs fine. Because the user is slow and the page loads complete.
But now I am creating the flow for reset password and confirm email.
On those flows, the page gets the query parameter from the url and makes the request for the recaptcha token, to be able to query the backend and validate the token.
const handleReCaptchaVerify = useCallback(async () => {
if (!executeRecaptcha) {
console.log("Execute recaptcha not yet available");
return;
}
const recaptchatoken = await executeRecaptcha("confirmemail");
console.log(recaptchatoken);
if (token) {
if (recaptchatoken != null) {
dispatch(actions.confirmEmailTokenValidation(token, recaptchatoken));
} else {
dispatch(
actions.notify("Recaptcha esta vindo em branco no ConfirmEmail", 1)
);
}
}
// Do whatever you want with the token
}, [executeRecaptcha]);
// You can use useEffect to trigger the verification as soon as the component being loaded
useEffect(() => {
handleReCaptchaVerify();
}, [handleReCaptchaVerify]);
What happens is that on page load, The useEffect is trying to get the token but I always get the message: Execute recaptcha not yet available
Any hints on how to force to wait a token, then dispatch api events?
Thanks
Pucci
The text was updated successfully, but these errors were encountered:
Hi. Thanks for your lib! I am using this library to login flow and register flow. Everything works fine when the user action is slow, so the user clicks on register, the flow runs ok without
Execute recaptcha not yet available
This is my HOC
This is my Register button click:
This runs fine. Because the user is slow and the page loads complete.
But now I am creating the flow for reset password and confirm email.
On those flows, the page gets the query parameter from the url and makes the request for the recaptcha token, to be able to query the backend and validate the token.
What happens is that on page load, The useEffect is trying to get the token but I always get the message:
![image](https://user-images.githubusercontent.com/38509299/134046281-39b79385-44ff-4883-a61c-49b39ff53e6f.png)
Execute recaptcha not yet available
Any hints on how to force to wait a token, then dispatch api events?
Thanks
Pucci
The text was updated successfully, but these errors were encountered: