Adding Google reCaptcha v3 to the Shopify contact form

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.

1 Like
Excursionist
26 0 16

I can confirm this.  I applied reCaptcha to my contact form and everything about it LOOKS like it's working, but it has done exactly nothing at all to stop spam.

0 Likes
Highlighted
Excursionist
17 0 3
There are paid plugins on the shopify store which offer captcha support. So the things are two.

Or they offer what they can't provide (if the serverside validation is not possible to implement)

Or

It is possible and shopify is not willing to get unpaid access to this feature. As this should be a basic feature IMHO and I thing every store which needs a customer interaction should have a protection against spam bots.
I can't believe that shopify sells a car where a wheel is missing. But the silence of shopify staff to this shows me that it is like this.

"we sell you the most powerful and modern car but if you need the fourth wheel just give us $5 per month more"
0 Likes

A third-party app can offer a captcha-enforced contact form by routing the contact form submissions through their own servers, which can support reCaptcha. They don't actually add captcha support to Shopify's native functionality.

0 Likes
New Member
4 0 0

Thank you so much!


@emmapettingill wrote:

Hi Clint,

 

This is what I did and it worked. I added recaptcha version three copied the code

 

 
  <script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>
 
<script>
  grecaptcha
.ready(function() {
      grecaptcha
.execute('reCAPTCHA_site_key', {action: 'homepage'}).then(function(token) {
         
...
     
});
 
});
 
</script>

 

I replace "reCAPTCHA_site_key with the site key provided by google when signing up for reCAPTCHA. I then went to customize my theme, actions dropdown, edit code. Then I went into the theme.liquid file and pasted the code above right before the end </head> tag.

 

Hope this helps


 

0 Likes
Excursionist
63 1 11

Hi, Your Captcha instructions did work for our customer registration and contact form. But, I couldn't make it work for the 'blog comments'. Was wondering whether it is possible to add the script somewhere in order to discourage senseless bot comments? Any ideas? Btw, thanks for your helpful tips - awesome because finding good advice here may sometimes feel like looking for gold in the sea!

0 Likes
Shopify Partner
3 0 2

It's easy enough to add the client-side prompt to appear, but you then have to post the token you receive to Google for verification - otherwise your spam will just continue. This verification must be done server-side which is not possible on Shopify at the moment. We need Shopify themselves to add this support natively and then we would just enter the two Google codes into the site settings.

 

Ironically, Shopify use reCaptcha v2 when signing in to these forums :)

2 Likes
Excursionist
63 1 11

That is fine, Al, it's just that we do not know where to paste the code with our Google key. We've already pasted it into 2 other Shopify forms and it's working in both.

0 Likes
Excursionist
17 0 3
Sure they use XD. We just don't need this feature and it has to be paid if you want. You rent a flat and heating is extra
0 Likes
New Member
2 0 0

After reviewing all the information provided in this thread my question is...does the outlined steps provided actually work? I'm kinda savy in adding code to the right areas within my site pages but really would like to know IF this works for sure and what the EXACT steps are.  I've recently being receiving numerous bot accounts being created along with some threatening spam emails.  I need the recaptcha (if works) for: registration of new account, logins, and contact form.  Any help with exact steps and IF this really helps would be great!  Many thanks and appreciation upfront. :)

0 Likes