Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Sample usage of gatsby-plugin-recaptcha

I have to use gatsby-plugin-recaptcha for forms in my project. I am not able to find any example of usage of this plugin. It will be big help if someone can share any information regarding this.

Thanks

like image 768
khushboo29 Avatar asked Dec 18 '18 06:12

khushboo29


People also ask

How do you reCaptcha Gatsby?

Add a unique random identifier at the end of Google's reCaptcha script so each page has his own reCaptcha script. Then, add reCaptcha div in your form. No need of complex Gatsby plugin.

What is Gatsby plugin?

Gatsby is a modern static-site generator that has revamped the way static websites are being built. It incorporates React, Node. js, and GraphQL to create stunning and blazing-fast websites.


1 Answers

Place this code in your component and import <Helmet/> from react-helmet.

<React.Fragment>
  <Helmet>
    <script src={`https://www.google.com/recaptcha/api.js?r=${Math.random()}`} async defer>
    </script>
  </Helmet>
  <form>
    <div className="g-recaptcha" data-sitekey={REACAPTCHA_PUBLIC}>
    </div>
  </form>
</React.Fragment>
like image 57
Kashi Mamidisetti Avatar answered Oct 21 '22 13:10

Kashi Mamidisetti