Google reCAPTCHAのv2とv3の違いのお話

  • このエントリーをはてなブックマークに追加

Google reCAPTCHA(リキャプチャ)とはGoogleが提供している認証システムで、現在はv2とv3が用意されています。

なんとなく「v3ってv2の進化版でしょ?」という感じがするのですが、調べてみるとどうもそうとも言い切れないので、まとめてみました。

ちなみに無料で利用できますが大規模サイトやアクセス数の多いサイトはエンタープライズ版を利用する必要があるみたいです。

reCAPTCHAの登録について

reCAPTHCAを使用登録する前にGoogleのサービスですのでGoogleアカウントが必要です。
事前に作成取得しておきましょう。

取得後に、reCAPTCHAの管理画面からサイトを登録します。

https://www.google.com/recaptcha/admin/create

登録はドメイン単位ですが、複数のドメインを登録できるので、テスト環境などがある場合は同じ情報で利用できます。


ラベル サイトを識別するための名前なのでドメインかサイト名を設定しましょう
reCAPTCHAタイプ reCAPTCHAのタイプを選択します v2かv3のどちらかを選択できます。
ドメイン 利用するドメインを入力します。(複数登録可能)
オーナー Googleアカウントのメールアドレスを入れると、そのアカウントでも利用することができます。最初に設定してあとからクライアントのアカウントに切り替えることも可能

その後「reCAPTCHA 利用条件に同意する」にチェックを入れて「送信」を押すと登録が完了します。
登録できると「reCAPTCHAのキー」が発行されますので、それぞれ保存してください。
  • サイトキー … HTMLに仕込むキーとなります。
  • シークレットキー … サイトとreCAPTCHA間の通信で使用します。こちらはサイト上に公開しないでください。
以上でreCAPTCHAの登録が完了しました。

結局reCAPTCHA v3とreCAPTCHA v2、どっちを使えばいいの?

先ほどの登録でreCAPTCHA v2 か v3を選択してもらいましたが、じゃあどちらがいいんだろうという話になります。

決してv3 > v2 になるわけではなく、用途によって使い分けが必要だと思います。

reCAPTCHA v2

reCAPTCHA v2はユーザー側にアクションを行ってもらうことで自分はロボット(コレではない)ではないよと証明してもらう認証方式です。


利点としてはユーザーにアクションを行ってもらうことで、かなり高い精度で判定ができます。
またユーザーにreCAPTCHAの存在を意識させることで「お、このサイトはちゃんとしてるな」と思わせることができるかもしれません。

欠点としてはわざわざ「ロボットではありません」にチェックをさせることの煩わしさがあります。

また、怪しいユーザーの場合は画像による認証があったりするので、特に画面の小さなスマホの場合だと、押しミスによる認証失敗が多発して離脱されるケースもあります。

reCAPTCHA v3

reCAPCHA v3はユーザー側からアクションを起こしてもらうことはなく、ユーザーがサイトにアクセスした時点でユーザーの環境や行動パターンによりスコアが自動的に設定され、そのスコアによって許可するかどうか判定します。


導入するとブラウザの右端に表示され、画面上にreCAPTCHAのチェックボックスは存在しません。

利点としてはユーザーからすると何もアクションがなく自動的に判定されるため、チェックを入れるなどのアクションや認証されていることを自覚することなく進めるのでストレスがないと思います。
特にスマホの場合はチェックボックスを押すのも意外と大変なのでスマホサイトであればv3でいいかもしれません。

欠点としては先ほどのスコアが低い場合はbotと判定され、そこから先に進めなく、しかもどうすればよいかのフォローができないため、強制的に離脱させられる可能性があります。

スコアに関しては細かな判定基準は出ていないのですが、「1.0から0.0までの数値が返ってきて1.0に近いほど人間であろう、0.0に近いほどbotであろう」という事らしいです。

このスコアの閾値(判定基準)は設定で行えるので、低くして間口を広げるか、高くしてセキュリティを高めるかの判断は難しいです。

じゃあどちらが便利?

これに関しては用途とリスクをどう取るかということになりそうです。

個人的にはreCAPTCHAのスコアに対する理解とご納得をしたいただく場合はv3を、それ以外は基本的にv2を導入した方がよいかなと思います。

また、スマホサイトの場合は入力がシンプルなv3を、PCサイトの場合はv2でという使い分けもいいかもしれません。

いずれにせよGoogleもv2を無くす予定はなさそうなので、しばらくは併用していくのがよいかなと思います。

 

執筆者:松本[ エンジニア ]

関連記事

マークアップ

背景に画像や動画を置いてパララックス効果で見せる

サイトを作っているとスクロールした時に背景画像などを固定させておきたい、パララックス効果を使いたいという時があると思います。 簡単なものであれば簡単なcssで実現できます。 目次1 背景画像をパララックス効果で見せる1.1 DEMO1.2 HTML1.3 CSS 背景画像をパララックス効果で見せる DEMO See the Pen Untitled by kkdd (@kk8kk) on CodePen. なんとなくよく見る感じの表示になっていると思います。 HTMLとcss […]

スマホアプリ

Android Studioでベクター画像を登録しよう

Androidアプリを作成しているとアプリ内のアイコン画像を追加したい、ということありますよね。 そんな時は画像の解像度を気にせず使用できる、ベクター画像を使用すると便利です。 Android Studioでは、ちょっとした手順を踏めばベクター画像をdrawableリソースの中にxmlファイルとして生成してしてくれます。 簡単なので、早速進めてみましょう。 目次1 Android Studioを開こう2 ベクター画像の登録画面を開こう3 クリップ・アートで登録してみよう4 ロ […]

マークアップ

属性セレクターを使ってファイルごとにアイコンをつけよう!

例えばpdfのアイコンをつけたいときに『pdfIcon』をというclassをつけて表示させる、という方法があります。 ただ動的に表現したい場合などにちょっと不便だなと思うこともあるかと思います。 そんな時は属性セレクターを使ってファイルごとにアイコンをつけることができます。 早速属性セレクターを使ってみよう 属性セレクターはを使えば指定された値が存在していたら指定されたcssを適用する、という感じの動作をしてくれます。 書き方としては「属性$=”値”」 […]

株式会社8bit (エイトビット)

東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。

Web制作に関するご相談はお気軽にどうぞ

弊社に制作をご依頼いただく際の費用感をご確認いただける、
見積りシミュレーションをご用意いたしました。