Questions tagged [react-google-recaptcha]

74 questions
8
votes
2 answers

react-google-recaptcha "ref" type error in React typescript

I'm trying to implement invisible reCaptcha from react-google-recaptcha in type script project I added the package's type by yarn add @types/react-google-recaptcha but when I want to implement the component, I get a type script error in here …
Yaya
  • 4,402
  • 4
  • 19
  • 43
6
votes
1 answer

How do the keys work with reCAPTCHA v3 Enterprise?

I'm trying to include reCAPTCHA in a React application I'm developing, with Next.js for the server side functionality. I think I'm fundamentally confused by reCAPTCHA Enterprise. The former "free" way to register a domain with reCAPTCHA was such…
6
votes
0 answers

Google recaptcha Cannot read property 'style' of null

When form validation fails I need to reset the captcha otherwise I can't seem to submit the form again. However, when calling reset I get an error "Cannot read property 'style' of null " import ReCAPTCHA from "react-google-recaptcha"; const…
Waterfall
  • 584
  • 1
  • 5
  • 15
5
votes
0 answers

Recaptcha timeouts on some browsers

Using react-google-recaptcha-v3 executing await executeRecaptcha("contact"); timeouts on some browsers. I am not sure if the root cause is within the repo (issue) or upstream, as it only fails in some browser configurations. Any help is highly…
ohlr
  • 1,839
  • 1
  • 13
  • 29
5
votes
1 answer

Google Recaptcha component with dynamic theme value - Next.js

I'm using react-google-recaptcha for a simple contact form on Next.js. The app theme can be toggled using a button that triggers a function that appends 'dark' to html as a class and adds a variable in localStorage. How do I get the recaptcha to…
Byron
  • 51
  • 4
4
votes
1 answer

React-google-recaptcha does not appear in the modal when the component is rendered

I am using react-google-ReCAPTCHA in bootstrap modal. First time its visible when I close the modal and again reopen the modal its not visible
4
votes
1 answer

Next.js how to implement react-google-recaptcha in my contact form

I am trying to implement Google Recaptcha on my contact form in Next.js. It does popup the challenge when needed, but sends the form anyway. Here's my code so far: // Recaptcha const recaptchaRef = useRef(); // Form validation const…
Mark
  • 731
  • 2
  • 10
  • 29
3
votes
1 answer

"browser-error" in google reCaptcha V3 (invisible)

I am using google reCaptcha v3 (invisible), but I am getting some response payload with: { "success": false,   "error-codes": [     "browser-error"   ] } I've googled but haven't found any information about "browser-error" from 7900 reCaptcha v3…
3
votes
2 answers

How to Integrate Google reCAPTCHA with react-hook-form?

I have been using react-hook-form before, for users to submit their email address in a basic form: BEFORE: react-hook-form, no catpcha import React from 'react' import { useForm } from 'react-hook-form' import { useRouter } from 'next/router' const…
3
votes
0 answers

Google reCaptcha V3 not working in Incognito browser

We are currently facing issues with Google reCaptcha V3 implementation for incognito. It works fine in Standard browser mode. The issue is when you are filling a form in the incognito mode the Recaptcha score is always lower than 0.5, so the…
Yatheen
  • 31
  • 2
3
votes
3 answers

Invisible reCAPTCHA disappears on page navigation in next.js app

I have reCAPTCHA on 3 separate pages. They appear perfectly on the first load. But they disappear when I navigate to another page and then re-navigate back to that page (the one having the captcha) again. My application is a single-page application.…
3
votes
2 answers

How to verify the token and get score using react-google-recaptcha-v3?

I'm using the library react-google-recaptcha-v3 in order to integrate reCAPTCHA v3 into my React application, which also uses Next. There's the following example in the README introducing users to the useGoogleReCaptcha hook: import { …
EB2127
  • 1,788
  • 3
  • 22
  • 43
3
votes
1 answer

How to make invisible react-google-recaptcha, Formik and yup work together?

I'm trying to make invisible react-google-recaptcha, Formik and yup to work together. The documentation says we should call recaptchaRef.current.execute() on form submission, but if we use Formik and yup together, it will trigger the submission…
3
votes
3 answers

React recaptcha google not showing at all

I have installed react-recaptcha-google and added to my app as per the example here: https://medium.com/codeep-io/how-to-use-google-recaptcha-with-react-38a5cd535e0d Nothing is showing up though, no error, no nothing. import React, { Component }…
nickornotto
  • 1,946
  • 4
  • 36
  • 68
3
votes
1 answer

issue while resetting the recaptcha - Cannot read property 'reset' of null for the code

react-google-recaptcha version: 2.0.0-rc.1 I am having an issue while resetting the recaptcha I am using a functional component extracts of code as below // imports etc.. here const Login: NextPage = (props:any) => { // othere initializations…
kakabali
  • 3,824
  • 2
  • 29
  • 58
1
2 3 4 5