Setting up reCAPTCHA with emailJS

Its surprisingly easy to add reCAPTCHA to a contact form with emailJS. You will need the following:

1. A domain (netlify works fine)
2. A google account (used for reCAPTCHA)
3. An email js account found here

Once you've set up your email form on email js. Go into the settings tab and check the box to use reCAPTCHA v2. Keep this tab open, as we will need it again in a moment.

Head over to reCAPTCHA and click the plus icon to make a new reCAPTCHA. Enter any domains your site may run on, without https:// or any specific page. (For https://website.com/webpage.html you only need to put in website.com) Also ensure you've selected reCAPTCHA v2, v3 will not work with emailJS. You can use any type of reCAPTCHA you like, but I personally used the "I'm not a robot" checkbox.

You'll then see two keys, the first one is your html key, it goes in the html code, more on that in a moment. The second key is the one you give to emailJS, simply copy/paste it into the field below the box you checked to activate reCAPTCHA.

Once you have your form on the page. Place the following code in the form, I prefer directly above the submit button.

<div class="g-recaptcha" data-sitekey="your_site_key"></div>
<br/>

Replace the site key with your html key given to you by google. Push your changes and things should work fine!

One small note is that you won't be able to use your form on a localhost system, since it is not one of the configured domains. I recommend commenting out the reCAPTCHA while testing, but don't forget to uncomment before you publish!