Ad

ReCAPTCHA V3 Is Not Working In A Shopify Contact Form, How Can I Solve It?

- 1 answer

Yesterday I added Google ReCAPTCHA v3 in one of my client's Shopify website, but I don't think that it is working because he is still reporting to receive several spam e-mails.

I've followed Google's guide, but I don't know what to do for "Verifying user response" part of the guide. I'm not an expert in coding.

Basically I've added this code to the theme.liquid file

<script src="https://www.google.com/recaptcha/api.js?render=*site key provided by google*"></script>

And then I've added this part in the page.contact.liquid file:

<script> grecaptcha.ready(function() {
  grecaptcha.execute('*site key provided by google*', {action: 'contact'}).then(function(token) {
     ...
  }); }); </script>

Have I missed out something? Can someone help me to fix this issue please?

Ad

Answer

Unfortunately, any attempt to implement reCaptcha on a native Shopify contact form will not work. It may appear to work, as in the form submits and you see the stats in the reCaptcha admin, but it won't actually be blocking any spam. The reason is that you can only implement the client-side piece in your theme, and in order to work, you must have both the client and server-side pieces in place and working. The server-side piece is what detects a failed captcha (i.e., a spam bot) and prevents the form from being submitted.

Implementing just the client-side piece might block some of the most unsophisticated spam bots that just see the captcha and stop, but it's trivial to design a bot to bypass the client-side piece: that's why the server-side piece is essential.

Also posted this answer on the Shopify forum thread linked by Chami, as people there are going in circles thinking it's possible or thinking it's working when it's not. 🙂

Update: Since originally posting this reply, Shopify has built reCaptcha support directly into the platform, and it's turned on by default. With this done, there's no need to implement the frontend code either within the theme, as it will be included automatically: https://help.shopify.com/en/manual/online-store/os/preferences#protect-your-store-with-google-recaptcha

Ad
source: stackoverflow.com
Ad