ウェブアプリのデバッグ プロバイダで App Check を使用する

アプリを App Check に登録した後に、App Check が有効と分類しないアプリをローカルの開発環境や継続的インテグレーション(CI)環境などで実行する場合は、実際の証明書プロバイダの代わりに App Check デバッグ プロバイダを使用するデバッグビルドをアプリに作成できます。

localhost でデバッグ プロバイダを使用する

開発中など、localhost からアプリを実行しているときにデバッグ プロバイダを使用するには、次の操作を行います。

  1. App Check を初期化する前に、デバッグビルドで self.FIREBASE_APPCHECK_DEBUG_TOKENtrue に設定してデバッグモードを有効にします。次に例を示します。

    ウェブ向けのモジュラー API

    self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
    initializeAppCheck(app, { /* App Check options */ });
    

    名前空間対応の Web API

    self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
    firebase.appCheck().activate(/* site key or provider */);
    
  2. ウェブアプリをローカルで表示し、ブラウザのデベロッパー ツールを開きます。デバッグ コンソールに、デバッグ トークンが表示されます。

    AppCheck debug token: "123a4567-b89c-12d3-e456-789012345678". You will
    need to safelist it in the Firebase console for it to work.
  3. Firebase コンソールの [App Check] セクションで、アプリのオーバーフロー メニューから [デバッグ トークンを管理] を選択します。前の手順でロギングされたデバッグ トークンを登録します。

    [デバッグ トークンを管理] メニュー項目のスクリーンショット

トークンを登録すると、Firebase バックエンド サービスはトークンを有効なものとして受け入れます。

このトークンを使用すると、有効なデバイスでなくても Firebase リソースにアクセスできます。このトークンは他に漏らさないように注意してください。公開リポジトリには commit しないでください。登録されたトークンが不正利用された場合は、直ちに Firebase コンソールでトークンを取り消してください。

このトークンは、ブラウザのローカルに格納され、同じマシンの同じブラウザでアプリを使用するたびに使用されます。トークンを別のブラウザや別のマシンで使用する場合は、self.FIREBASE_APPCHECK_DEBUG_TOKENtrue ではなくトークン文字列に設定します。

CI 環境でデバッグ プロバイダを使用する

継続的インテグレーション(CI)環境でデバッグ プロバイダを使用するには、次の手順を行います。

  1. Firebase コンソールの [App Check] セクションで、アプリのオーバーフロー メニューから [デバッグ トークンを管理] を選択します。新しいデバッグ トークンを作成します。このトークンは次の手順で必要になります。

    このトークンを使用すると、有効なデバイスでなくても Firebase リソースにアクセスできます。このトークンは他に漏らさないように注意してください。公開リポジトリには commit しないでください。登録されたトークンが不正利用された場合は、直ちに Firebase コンソールでトークンを取り消してください。

    [デバッグ トークンを管理] メニュー項目のスクリーンショット

  2. 作成したデバッグ トークンを CI システムの安全なキーストアに追加します(たとえば、GitHub Actions の暗号化されたシークレットや Travis CI の暗号化された変数に追加します)。

  3. 必要に応じて、デバッグ トークンを CI 環境内で環境変数として使用できるように CI システムを構成します。変数に APP_CHECK_DEBUG_TOKEN_FROM_CI などの名前を付けます。

  4. App Check をインポートする前に、デバッグビルドで self.FIREBASE_APPCHECK_DEBUG_TOKEN をデバッグ トークンの環境変数の値に設定して、デバッグモードを有効にします。次に例を示します。

    ウェブ向けのモジュラー API

    self.FIREBASE_APPCHECK_DEBUG_TOKEN = process.env.APP_CHECK_DEBUG_TOKEN_FROM_CI;
    initializeAppCheck(app, { /* App Check options */ });
    

    名前空間対応の Web API

    self.FIREBASE_APPCHECK_DEBUG_TOKEN = process.env.APP_CHECK_DEBUG_TOKEN_FROM_CI;
    firebase.appCheck().activate(/* site key or provider */);
    

CI 環境でアプリを実行すると、Firebase バックエンド サービスは送信されたトークンを有効なトークンとして受け入れます。