reCAPTCHAとは、Googleが無料で提供しているBotと人間を判別するためのサービスで、「私はロボットではありません」という表示を一度は目にした経験があるでしょう。
ノーコードツール「Bubble」でも、今回紹介するreCAPTCHAをプラグインを用いることでアプリに導入することができます。
そこで本記事ではBubbleでreCAPTCHAを導入する方法から使い方、メリットやデメリットについて解説していきたいと思います。
【公式HP】https://itpropartners.com/
- 週3日〜の案件を数多く扱っている
- エンド直ゆえに高単価案件が多い
- フルリモート案件など、柔軟な働き方に対応した案件が多い
- トレンド技術を取り入れた魅力的な案件が豊富にある
- 専属エージェントが希望に沿った案件を紹介してくれる
＼ 最短60秒で登録可能！ ／
目次
【Bubble】reCAPTCHAプラグインの使い方
本章ではreCAPTCHAプラグインを用いてBubbleに「私はロボットではありません」を表示させる方法を解説いたします。
Google reCAPTCHAの登録
以下のURLをクリックしてreCAPTCHAの管理コンソールにアクセスします。
https://www.google.com/recaptcha/admin/create
URLをクリックすると、以下の画面に遷移するので、必要な項目を入力します。
- ラベル：登録するアプリのURL（https://example.bubbleapps.io等）
- reCAPTCHAタイプ：v2。「私はロボットではありません」チェックボックス
- ドメイン：bubbleapps.io
- オーナー：アプリ所有者のGoogleアカウントのメアド
上記の項目が入力できたら「reCAPTCHA利用条件に同意する」と「アラートをオーナーに送信する」にチェックを入れた状態で、送信ボタンをクリックしてください。
すると以下の画面に遷移するかと思うので、サイトキーとシークレットキーをコピーしてメモ帳か何かに貼り付けておきます。
これでGoogle reCAPTCHAの管理コンソール側での作業は完了となります。
reCAPTCHAプラグインのインストールとキー情報の入力
次に、Bubbleのプラグイン画面にて「reCAPTCHA」と検索し、reCAPTCHAプラグインをインストールしましょう。
インストールが完了すると「Site key」と「Secret key」を入力する箇所が出てくるので、先ほどコピーした値を貼り付けます。
これで設定は完了です。
reCAPTCHAプラグインの使い方
以上の設定が完了するとDesignタブのInput formsに「reCAPTCHA forms」という要素が表示されているはずなので、配置したい箇所にドラッグ＆ドロップしてみましょう。
また、ワークフロー作成時にreCAPTCHAフォームがチェックされた時のみ実行されるワークフロートリガーを追加できるようになったはずです。（以下の画像を参照）
以上でreCAPTCHAプラグインを用いてBubbleに「私はロボットではありません」を表示させる方法の解説は終了です。
reCAPTCHAの種類とメリット・デメリット
本章では実際にアプリにreCAPTCHAを導入するにあたり知っておくべき最低限の知識について触れておきたいと思います。
reCAPTCHAのメリット
reCAPRCHAのメリットは、botによる攻撃を防げる（スパム対策になる）ことです。
botによるフォーム登録は運用者にとってノイズとなりますし、ウィルスに感染させたり、個人情報を抜き出そうとしてきたりと百害あって一利なしの代物と言えます。
reCAPTCHAの導入により上記の問題が100%解決されるわけではありませんが、何もしないよりは絶対良いです。セキュリティ対策として次に説明するデメリットと天秤にかけて導入を検討すべきでしょう。
reCAPTCHAのデメリット
reCAPRCHAのデメリットは、ユーザビリティを損ねてしまうことです。
「私はロボットではありません」にチェックを入れたり、画像選択を迫られたりすることでユーザーは煩わしさを覚えるでしょう。
reCAPRCHAを設置することで、ユーザーの離脱率が上がることが考えられます。
そのため、reCAPRCHAを設置する際は必要最小限に留めておきましょう。
reCAPTCHAの種類
ざっくり以下の種類が存在します。
「reCAPRCHA v3」は先に説明した通り、ユーザーによる画像認証やチェックボックスへのチェックなどのアクションなしにbotか人間かの判断を自動で行ってくれます。
そのため、v3ではユーザビリティを損ねてしまうreCAPRCHAのデメリットなく、セキュリティ強度を高めることが可能です。
v2ではここまで説明してきた「私はロボットではありません」にユーザーがチェックを入れることでbotと人間の判別を行います。
上記はreCAPRCHA v2の中でもCheckboxの話であり、実際にはInvisibleやAndroidといった種類が存在するので、気になる方は公式ドキュメントを確認してみてください。
reCAPTCHAの導入によりbotによる攻撃を防げる。一方でチェックボックスへのチェックや画像選択など、ユーザビリティを損ねてしまうので使い所に注意。
【Bubble】reCAPTCHAプラグインの使い方｜まとめ
ここまでreCAPTCHAプラグインを用いてBubbleに「私はロボットではありません」を表示させる方法から、reCAPTCHAの種類や導入のメリットやデメリットについて解説してきましたが、いかがだったでしょうか？
Bubbleで開発するアプリケーションのセキュリティを高めるためにも是非reCAPTCHAの導入を検討してみてください(^^)
本記事がreCAPTCHAプラグインを用いてBubbleで開発するアプリに「私はロボットではありません」を表示させる方法を知る上で少しでもあなたのお役に立てたのなら幸いです。
