ベルリンのITスタートアップで働くジャバ・ザ・ハットリの日記

日本→シンガポール→ベルリンへと流れ着いたソフトウェアエンジニアのブログ

RailsにGoogleのreCAPTCHAを入れる

移転しました。

GoogleのreCAPTCHAとはこれのこと。登録の際にロボットと人間を区別するやつ。
f:id:tango_ruby:20160121181814g:plain

いまだに分かりにくいグニャっとした文字を読ませて入力する形式のCAPTCHAが使われているのが散見される。でもアレってロボットが98%の確率で正解させられるとか聞くし、ユーザーの負担もあるし、なによりエレガントさに欠ける。

その点、GoogleのreCAPTCHAはクリックするだけで今のとこ、いい感じなのでおすすめ。

RailsにGoogleのreCAPTCHAを入れる方法

1)こちらからユーザ登録する。
reCAPTCHA: Easy on Humans, Hard on Bots

2)ここに必要事項とか入れる。
f:id:tango_ruby:20160121183428p:plain

3)ambethia/recaptcha のGemを入れる
詳しくはここ
ambethia/recaptcha · GitHub

Gemfileに以下を記載する。

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

bundle installする

bundle install

4)イニシャルファイルに設定値を入れる

# config/initializers/recaptcha.rb
Recaptcha.configure do |config|
  config.public_key  = '6Lc6BAAAAAAAAChqRbQZcn_yyyyyyyyyyyyyyyyy'
  config.private_key = '6Lc6BAAAAAAAAKN3DRm6VA_xxxxxxxxxxxxxxxxx'
  # Uncomment the following line if you are using a proxy server:
  # config.proxy = 'http://myproxy.com.au:8080'
end

config.public_keyは登録した後のreCAPTCHA画面に表示されているSite key
config.private_key はSecret keyになる。

f:id:tango_ruby:20160121190459p:plain

ソースに直書きは危険なので、このあたりは環境に合わせて別の場所に入れてそこから引っ張ってくる。

5)Viewのフォーム内に<%= recaptcha_tags %>と入れるとそこにreCAPTCHAが入る。

<%= form_for @foo do |f| %>
  # ... other tags
  <%= recaptcha_tags %>
  # ... other tags
<% end %>

6)フォームの入力内容を受け取るコントローラーにverify_recaptchaを入れるとそれが判断結果を返す

# app/controllers/users_controller.rb
@user = User.new(params[:user].permit(:name))
if verify_recaptcha(model: @user) && @user.save
  redirect_to @user
else
  render 'new'
end

終わり。めちゃカンタンにreCAPTCHAの導入が完成。

ちなみに以下のパズルサイトに攻撃を受けたことがあって「reCAPTCHA入れとけばよかったかな。。。」と後悔したので書いた。
 
 
tango-ruby.hatenablog.com

tango-ruby.hatenablog.com