Flutter アプリで reCAPTCHA Enterprise を使用して App Check を使ってみる

このページでは、reCAPTCHA Enterprise プロバイダを使用して、Flutter アプリで App Check を設定する方法について説明します。App Check を使用すると、自分のアプリだけがプロジェクトのバックエンド リソースにアクセスできるようになります。詳しくは、App Check の概要をご覧ください。

App Check ではスコアベースの reCAPTCHA キーを使用する必要があるため、ユーザーには表示されません。つまり、reCAPTCHA Enterprise プロバイダがユーザーに課題の解決を求めることはありません。

ユースケースで App Check によって実装されない reCAPTCHA Enterprise 機能を必要とする場合や、独自のカスタム プロバイダで App Check を使用する場合は、App Check カスタム プロバイダを実装するをご覧ください。

1. Firebase プロジェクトを設定する

1. まだ行っていない場合は、Flutter プロジェクトに Firebase をインストールして初期化します。

2. Google Cloud コンソールで、[Fraud Defense] ページに移動し、reCAPTCHA Enterprise プロバイダに対して次の操作を行います。

   1. 正しいプロジェクトが選択されていることを確認します（画面上部のプロジェクト選択ツールを参照）。

   2. プロンプトが表示されたら、reCAPTCHA Enterprise API を有効にします。

   3. ターゲット プラットフォームに基づいてキーを作成します。

      iOS+

      iOS タイプのキーを作成し、アプリのバンドル ID（com.example.my_app など）を指定します。

      • Firebase プロジェクトで Firebase Apple アプリを作成したときに指定したバンドル ID と同じバンドル ID を入力してください。バンドル ID の値では大文字と小文字が区別されます。

      • App Check の場合、各バンドル ID は 1 つの reCAPTCHA キーにのみ対応します。

      Android

      Android タイプのキーを作成し、アプリのパッケージ名（例: com.example.my_app）を指定します。

      • Firebase プロジェクトで Firebase Android アプリを作成したときに指定したパッケージ名と同じものを入力してください。パッケージ名の値では大文字と小文字が区別されます。

      • App Check の場合、各パッケージ名は 1 つの reCAPTCHA キーにのみ対応できます。

      Web

      ウェブタイプのキーを作成し、ウェブアプリの各ドメインを指定します。

      • App Check は、250 を超えるドメインで配信されるウェブアプリをサポートしていません。

      • 本番環境にデプロイされている（またはデプロイされる予定の）reCAPTCHA 鍵のドメインとして localhost を追加しないでください。

      • [チェックボックスによる本人確認を使用する] オプションはオフのままにします。

      詳細な手順については、スコアベースの reCAPTCHA キーを作成するをご覧ください。

   4. 各キーをメモします。Firebase コンソールの登録フローにそれらを追加する必要があります。

3. Firebase コンソールで、[セキュリティ] > [App Check] に移動します。

4. [アプリ] タブで、ターゲット プラットフォームの各アプリを登録して、reCAPTCHA Enterprise プロバイダで App Check を使用するようにします。Google Cloud コンソールで取得した鍵を指定する必要があります。

5. 省略可: トークンの有効期間（TTL）を設定します。

   アプリの登録設定で、プロバイダが発行する App Check トークンのカスタム有効期間（TTL）を設定します。TTL は 30 分から 7 日までの任意の値に設定できます。この値を変更する場合は、次のトレードオフに注意してください。

   • セキュリティ: TTL が短いほど、漏えいしたトークンや傍受されたトークンが攻撃者によって悪用される可能性が低減するため、セキュリティが向上します。
   • パフォーマンス: TTL が短いほど、アプリで証明書の取得が頻繁に行われます。アプリで証明書が取得されるたびにネットワーク リクエストのレイテンシが増加するため、TTL が短いと、アプリのパフォーマンスに影響する可能性があります。
   • 割り当てとコスト: TTL を短くすると、証明書の取得が頻繁に発生し、割り当てが早く消費されます。有料サービスの場合は、費用が増加する可能性があります。割り当てと上限をご覧ください。

   通常は、デフォルトの TTL（1 時間）で十分です。App Check ライブラリは TTL の約半分でトークンを更新することに留意してください。

6. 省略可: 詳細設定を構成します。

7. [保存] をクリックします。

（省略可）詳細設定を構成する

ユーザーがアプリを開くと、reCAPTCHA Enterprise はキーの下のユーザー インタラクションがもたらすリスクレベルを評価し、0.1 刻みの 0.0 ～ 1.0 の範囲でスコアを返します。

• スコア 0.0 は、インタラクションのリスクが高く、不正行為の可能性があることを示します。
• スコア 1.0 は、インタラクションのリスクが低く、正当である可能性が非常に高いことを示します。

App Check では、アプリのリスクしきい値を設定して、このリスクに対する許容度を調整できます。

ほとんどのユースケースでは、デフォルトのしきい値 0.5 をおすすめします。ユースケースで調整が必要な場合は、Firebase コンソールで各アプリのこの値を構成できます（[セキュリティ] > [App Check] に移動）。以下のアプリのリスクしきい値の構成に関する重要な考慮事項を必ず展開してご確認ください。

2. アプリに App Check プラグインを追加する

reCAPTCHA Enterprise プロバイダを使用するには、対応する App Check プラグインを追加する必要があります。

1. Flutter プロジェクトのルートから、次のコマンドを実行してプラグインをインストールします。

   flutter pub add firebase_app_check
   

2. 完了したら、Flutter プロジェクトを再ビルドします。

   flutter run
   

3. App Check を初期化する

アプリでは、他の Firebase サービスを使用する前に App Check を初期化する必要があります。

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_app_check/firebase_app_check.dart';
import 'firebase_options.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
  await FirebaseAppCheck.instance.activate(
    providerWeb: ReCaptchaEnterpriseProvider(WEB_SITE_KEY),
    providerAndroid: const AndroidReCaptchaProvider(ANDROID_SITE_KEY),
    providerApple: const AppleReCaptchaProvider(IOS_SITE_KEY),
  );
  runApp(App());
}

4. 指標をモニタリングして適用を有効にする

アプリで App Check を設定したら、更新されたアプリのユーザーへの配布を開始します。

更新されたクライアント アプリは、Firebase にリクエストを送信するたびに App Check トークンを送信します。ただし、App Check が適用されるまで、App Check は無効なトークンを含むリクエストをブロックしません。