約束の地

キャロ組

Rails に reCAPTCHA を導入する

結論

  1. 公式サイトで登録をする*1
  2. reCAPTCHA の gem を入れる
  3. 環境変数に RECAPTCHA_SITE_KEYRECAPTCHA_SECRET_KEY の値を設定する
  4. formタグ の中に <%= recaptcha_tags %> を挿入する
  5. 結果を得る

手順

1. 公式サイトで登録をする

特に難しいところはないと思います。注意する点は、Key SettingsDomains のところに使用するサイトのドメインを正しく入力する点です。localhost127.0.0.1 は異なるものとして判断されます。ポート番号は必要ありません。

f:id:gregminster:20181023170452p:plain

Site key の値と Secret key の値を後ほど使います。

f:id:gregminster:20181023170431p:plain

2. reCAPTCHA の gem を入れる

こちらも特に問題ないかと思います。Gemfilegem 'recaptcha' と書いて bundle install しましょう

3. 環境変数に RECAPTCHA_SITE_KEYRECAPTCHA_SECRET_KEY の値を設定する

dotenv などを使って環境変数に RECAPTCHA_SITE_KEYRECAPTCHA_SECRET_KEY の値を設定します。前者に「1.」で取得した Site key を設定し、後者に Secret key を設定します。

4. formタグ の中に <%= recaptcha_tags %> を挿入する

特に問題ないかと思います。たとえば以下のような形になるかと思います。コントローラとアクション(メソッド)の組み合わせはいい具合に調整して下さい。

<%= form_with url: foobar_path, method: :get do |form| %>
  <%= form.text_field :your_text_field %>
  <%= recaptcha_tags %>
  <%= form.submit 'ボタンの名前' %>
<% end %>

上記を Webブラウザ 上で見ると以下のような形になるでしょう。

f:id:gregminster:20181023170538p:plain

5. 結果を得る

上記のフォームを受け取ったコントローラに、verify_recaptcha という変数が渡っています。この変数には true または false が入っています。前者が入っていれば認証成功、後者が入っていれば認証失敗です。この値を使って条件振り分けなどをするとよいと思います。

補足

gem の 公式ドキュメント や、reCAPTCHA の 公式ドキュメント が充実していますので、そちらを一読しておくとよいでしょう。

*1:Google アカウント が必要

Powered by はてなブログ