Easy way to implement reCAPTCHA V3 in Ruby on Rails

The difference between reCAPTCHA v2 and v3

You probably remember the tons of "I am not a robot" checkboxes you clicked on. If you were lucky you got passed through, if not you get a little riddle, where you can find all the cars, or stairs or whatever. 

Thats reCAPTCHA v2 - a user interaction based verification that the user is not a bot. 

reCAPTCHA v3 is a pure JavaScript API which you implement to your rails project. It returns a score and gives you the ability to take action in the context of your site. 
With reCAPTCHA v3 there is no user interaction needed.
 
Since i am over all the "I am not a robot" verifications i wanted to implement reCAPTCHA v3 to my latest rails project.

How to implement reCAPTCHA v3 in rails

STEP 1: Add needed Ruby Gems to your Rails Project

If you don't already have these gems in your gem file, add them and don't forget to run bundle install after you added them. 

gem "dotenv-rails"
gem "recaptcha", require: "recaptcha/rails"

STEP 2: Create your CAPTCHA API Keys

Go on https://www.google.com/recaptcha/admin/create and create your API Keys for the domain you want to add the reCAPTCHA for.

STEP 3: Store your CAPTCHA API Keys

Create a .env file in your project's root and store your API Keys in it. 

!! Naming convention: If you name your keys exactly like below then they will be read automatically by the gem.

RECAPTCHA_SECRET_KEY=********************************
RECAPTCHA_SITE_KEY=********************************

If your working with github, don't forget to add your .env file to .gitignore so that you don't upload the keys to github.

STEP 4: Adjust your method to call the reCAPTCHA verification

Since you are using a contact form which you have already implemented in your project, you should already have a method for the logic for handling your contact form. In my example the method is called contact_send which has a post route connected to it, so the contact form can communicate with it. 

In your reCAPTCHA verification you want to define the parameters for a positive verification and what actions should be executed if these parameters are not met.

unless verify_recaptcha(action: 'checkout', minimum_score: 0.8)
  Rails.logger.error "WARNING: illegal contact form request from \"#{request.remote_ip}\", score: #{recaptcha_reply['score']}, agent: \"#{request.user_agent}\""

  flash[:status] = "invalid-recaptcha"
  render :contact
  return 0
end

To make your reCAPTCHA verification work properly you have to pass it an action (Checkout the google actions here and a minimum score. 

Based on several tests I made, i came to the conclusion that if you don't pass a minimum score, the captcha uses the full range of 0.1–1.0, which makes your CAPTCHA useless.

I also implemented a Rails.logger to see more details about the error if the captcha does not verify a user and a flash status which will appear and inform the user that the verification was invalid.

STEP 5: Adjust your form .html.erb

In your .html.erb file you add the following line right above your submit button.

<%= recaptcha_v3(action: 'checkout') %>

If you added a flash, you would have to implement it in your .html.erb too.

I'll upload an article for effectively testing reCAPTCHA V3 soon, so make sure you follow.

Happy Rails riding ❤

Comments

[David Teren]

Nice one @yalinhua. Thanks for sharing.

Have you by any chance looked into alternatives and their pricing. I'm looking for an elegant solution like the one you demonstrate above, either free or super cheap.