お知らせ: Google Maps Platform に間もなく新しい基本地図のスタイルが導入されます。このアップデートにより、デフォルトのカラーパレットが新しくなるほか、ピンが最新化され、地図のエクスペリエンスとユーザビリティが改善されます。すべての地図のスタイルは、2025 年 3 月に自動的に更新されます。ご利用の詳細およびいち早く使用する方法については、Google Maps Platform の新しい地図のスタイルをご覧ください。

このページは Cloud Translation API によって翻訳されました。

App Check を使用して API キーを保護する

Firebase App Check は、正当なアプリ以外のソースから送信されたトラフィックをブロックすることで、アプリから Google Maps Platform への呼び出しを保護します。これは、reCAPTCHA Enterprise などの構成証明プロバイダのトークンをチェックすることで行われます。アプリを App Check と統合すると、悪意のあるリクエストから保護されるため、不正な API 呼び出しに対して料金が発生することはありません。

App Check は私に適していますか？

ほとんどの場合、App Check の使用をおすすめしますが、次のケースでは App Check は必要ないか、サポートされていません。

元の Places SDK を使用している。App Check は Places SDK（新規）でのみサポートされています。
限定公開アプリまたは試験運用版アプリ。アプリが一般公開されていない場合は、App Check は必要ありません。
アプリがサーバー間通信でのみ使用される場合は、App Check は必要ありません。ただし、GMP と通信するサーバーが一般公開されているクライアント（モバイルアプリなど）で使用されている場合は、GMP ではなく App Check を使用してそのサーバーを保護することを検討してください。

実装手順の概要

アプリを App Check と統合する手順は、大まかに次のとおりです。

Firebase をアプリに追加します。
App Check ライブラリを追加して初期化します。
トークンプロバイダをアプリに追加します。
Places API と App Check API を初期化します。
デバッグを有効にします。
アプリのリクエストをモニタリングし、適用を決定します。

App Check を統合すると、Firebase コンソールでバックエンドトラフィックの指標を確認できるようになります。これらの指標は、有効な App Check トークンが付加されているかどうかでリクエストの内訳を示します。詳細については、Firebase App Check のドキュメントをご覧ください。

ほとんどのリクエストが正当なソースからのものであり、ユーザーが App Check の実装を含む最新バージョンのアプリに更新していることを確認できたら、適用を有効にできます。適用を有効にすると、App Check は有効な App Check トークンのないすべてのトラフィックを拒否します。

App Check の統合を計画する際の考慮事項

統合を計画する際に考慮すべき点は次のとおりです。

推奨される構成証明プロバイダの 1 つである reCAPTCHA Enterprise では、1 か月あたり 10,000 件を超える評価に対して料金が発生します。
推奨されるもう 1 つの構成証明プロバイダである reCAPTCHA v3 には割り当てがあり、割り当てを超えるとトラフィックは評価されなくなります。

カスタム構成証明プロバイダを使用することもできますが、これは高度なユースケースです。詳しくは、App Check のドキュメントをご覧ください。
アプリの起動時にレイテンシが発生します。ただし、その後は定期的な再構成証明がバックグラウンドで行われるため、ユーザーはレイテンシを感じなくなります。起動時のレイテンシの正確な値は、選択した構成証明プロバイダによって異なります。

再構成証明の頻度は、App Check トークンが有効な期間（有効期間、TTL）によって決まります。この期間は Firebase コンソールで設定できます。再構成証明は、TTL の約半分が経過したときに行われます。詳細については、証明書プロバイダの Firebase のドキュメントをご覧ください。

アプリを App Check と統合する

前提条件と要件

最新の週次または四半期版の Maps JS API、Core、Places ライブラリが読み込まれたアプリ。
Maps JS API と Places API（新規）が有効になっている Cloud プロジェクト。
Cloud コンソールでアプリの所有者である必要があります。
Cloud コンソールからアプリのプロジェクト ID を取得する必要があります。

ステップ 1: Firebase をアプリに追加する

Firebase デベロッパー向けドキュメントの手順に沿って、Firebase をアプリに追加します。

ステップ 2: App Check ライブラリを追加して App Check を初期化する

Firebase には、デフォルトの構成証明プロバイダごとに手順が用意されています。ここでは、Firebase プロジェクトを設定し、App Check ライブラリをアプリに追加する方法について説明します。提供されているコードサンプルに沿って、App Check を初期化します。

reCAPTCHA Enterprise の手順。
reCAPTCHA v3 の手順。

Cloud コンソールで API を有効にする前に、reCAPTCHA v3 にサイトを登録し、reCAPTCHA サイト登録ツールを使用して reCAPTCHA v3 のサイトキーと秘密鍵を取得する必要があります。詳細と手順については、reCAPTCHA v3 のドキュメントをご覧ください。

ステップ 3: Maps JS API ライブラリを読み込む

次のスニペットに示すように、core、Maps、Places ライブラリを読み込みます。詳細と手順については、Maps JavaScript API の Place Class のドキュメントをご覧ください。

async function init() {
  const {Settings} = await google.maps.importLibrary('core');
  const {Map} = await google.maps.importLibrary('maps');
  const {Place} = await google.maps.importLibrary('places');
}

ステップ 4: Places API と App Check API を初期化する

Firebase コンソールから提供された構成を使用して App Check を初期化します。
- reCAPTCHA v3 の手順
- reCAPTCHA Enterprise の手順

Maps JS API へのリクエストに App Check トークンが含まれていることを確認します。

  async function init() {
    const {Settings} = await google.maps.importLibrary('core');
    const {Map} = await google.maps.importLibrary('maps');
    const {Place} = await google.maps.importLibrary('places');
  
    const app = initializeApp({
      // Your firebase configuration object
    });
  
    // Pass your reCAPTCHA Enterprise site key to initializeAppCheck().
    const appCheck = initializeAppCheck(app, {
      provider: new ReCaptchaEnterpriseProvider(
        'abcdefghijklmnopqrstuvwxy-1234567890abcd',
      ),
  
      // Optional argument. If true, the SDK automatically refreshes App Check
      // tokens as needed.
      isTokenAutoRefreshEnabled: true,
    });
  
    Settings.getInstance().fetchAppCheckToken = () =>
        getToken(appCheck, /* forceRefresh = */ false);
  
    // Make a Places JS request
    const place = new Place({id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg'});
    await place.fetchFields({fields: ['*']});
  
    // Load a map
    map = new Map(document.getElementById("map"), {
      center: { lat: 37.4161493, lng: -122.0812166 },
      zoom: 8,
    });
  }

ステップ 5: デバッグを有効にする（省略可）

アプリをローカルで開発してテストする場合や、継続的インテグレーション（CI）環境で実行する場合は、デバッグシークレットを使用して有効な App Check トークンを取得するアプリのデバッグビルドを作成できます。これにより、デバッグビルドで実際の構成証明プロバイダを使用する必要がなくなります。

アプリをローカルでテストするには:

開発目的でデバッグプロバイダを有効にする。
SDK のデバッグログから、自動生成されたランダムな UUID4（App Check のドキュメントでは「デバッグトークン」と呼ばれます）が返されます。このトークンを Firebase コンソールに追加します。
詳細と手順については、App Check のドキュメントをご覧ください。

CI 環境でアプリを実行するには:

Firebase コンソールからランダムな UUID4 を生成します。
UUID4 をデバッグトークンとして追加し、テスト実行ごとに CI テストがアクセスするシークレットストアにコピーします。
詳細と手順については、App Check のドキュメントをご覧ください。

ステップ 6: アプリのリクエストをモニタリングして適用を決定する

適用を開始する前に、アプリの正規ユーザーに支障をきたさないようにする必要があります。そのためには、App Check 指標画面で、アプリのトラフィックのどの程度が確認済み、古い、または不正であるかを確認します。トラフィックの大部分が確認されたら、適用を有効にできます。

詳細と手順については、Firebase App Check のドキュメントをご覧ください。