本頁面由 Cloud Translation API 翻譯而成。

開始在網頁應用程式中，搭配使用 App Check 和 reCAPTCHA Enterprise

本頁將說明如何在網頁應用程式中啟用 App Check。 reCAPTCHA Enterprise 供應商。啟用 App Check 可協助確保確保只有您的應用程式可以存取專案的 Firebase 資源。查看這項功能的總覽。

請注意，App Check 使用 reCAPTCHA Enterprise 分數制網站金鑰，不向使用者顯示。reCAPTCHA Enterprise 供應商不需要以便隨時解決難題

如要透過自訂服務供應商使用 App Check，請參閱導入自訂 App Check 供應器。

1. 設定 Firebase 專案

將 Firebase 新增至您的 JavaScript 專案 (如果您尚未這麼做) 已完成其他驗證步驟
開啟 reCAPTCHA Enterprise ，然後執行下列操作：
1. 如果系統提示您啟用 reCAPTCHA Enterprise API，請按照提示操作。
2. 建立網站類型金鑰。您需要指定在其中顯示哪些網域您能夠託管網頁應用程式離開「使用核取方塊驗證方式」選項 未選取。
註冊應用程式以透過 reCAPTCHA Enterprise 使用 App Check 中的 App Check 專區 Firebase 控制台。您需要提供先前取得的網站金鑰上一個步驟

通常您需要註冊專案的所有應用程式，因為允許對 Firebase 產品強制執行；只有已註冊的應用程式可以存取產品的後端資源
選用：在應用程式註冊設定中自訂存留時間 (存留時間) 適用於供應商核發的 App Check 個權杖。您可以設定存留時間設為 30 分鐘至 7 天之間的任何值。變更這個值時，瞭解下列優缺點：
- 安全性：較短的存留時間可提高安全性，因為這麼做能減少出現安全漏洞，可能導致權杖遭到洩漏或攔截攻擊者
- 效能：縮短存留時間 (TTL) 越短，應用程式就越能執行認證經常更新因為應用程式認證程序會增加網路延遲時間因此短暫的存留時間 (TTL) 可能會影響效能
- 配額與費用：縮短存留時間 (TTL) 和頻繁的重新認證作業，皆會破壞您的配額更快，而如果是付費服務，費用可能更高。請參閱配額與上限。
預設存留時間 1 小時 對大多數應用程式而言都是合理的做法。請注意，重新整理 App Check 程式庫權杖的 75 倍。

2. 將 App Check 程式庫新增至應用程式

將 Firebase 新增至網頁應用程式 (如果尚未加入)。請務必匯入 App Check 程式庫。

3. 初始化 App Check

先將下列初始化程式碼加入應用程式，再存取任何 Firebase 服務。您必須傳送 reCAPTCHA Enterprise 網站金鑰。也就是您在 Cloud 控制台中建立的 activate()。

Web

import { initializeApp } from "firebase/app";
import { initializeAppCheck, ReCaptchaEnterpriseProvider } from "firebase/app-check";

const app = initializeApp({
  // Your Firebase configuration object.
});

// Create a ReCaptchaEnterpriseProvider instance using your reCAPTCHA Enterprise
// site key and pass it to initializeAppCheck().
const appCheck = initializeAppCheck(app, {
  provider: new ReCaptchaEnterpriseProvider(/* reCAPTCHA Enterprise site key */),
  isTokenAutoRefreshEnabled: true // Set to true to allow auto-refresh.
});

Web

firebase.initializeApp({
  // Your Firebase configuration object.
});

// Create a ReCaptchaEnterpriseProvider instance using your reCAPTCHA Enterprise
// site key and pass it to activate().
const appCheck = firebase.appCheck();
appCheck.activate(
  new firebase.appCheck.ReCaptchaEnterpriseProvider(
    /* reCAPTCHA Enterprise site key */
  ),
  true // Set to true to allow auto-refresh.
);

後續步驟

在應用程式中安裝 App Check 程式庫後，請部署程式庫。

新版用戶端應用程式會開始傳送 App Check 個符記，但 Firebase 產品不需要權杖您必須在App Check Firebase 控制台。

監控指標並啟用強制執行功能

不過，啟用強制執行功能之前，請先確認這項操作不會幹擾現有的合法使用者另一方面，如果您發現如果您對應用程式資源都很可疑，不妨啟用強制執行功能

為做出決定，您可以查看這些廣告主的 App Check 指標您使用的服務：

監控 App Check 個要求指標： Realtime Database、Cloud Firestore、Cloud Storage 和 Authentication (Beta 版)。
監控「Cloud Functions」的 App Check 個要求指標。

啟用「App Check」強制執行功能

瞭解 App Check 對使用者的影響，您可以做好準備下一步，您可以啟用 App Check 強制執行功能：

允許強制使用 App Check： Realtime Database、Cloud Firestore、Cloud Storage 和 Authentication (Beta 版)。
為 Cloud Functions 啟用 App Check 強制執行功能。

在偵錯環境中使用 App Check

只要在為「App Check」註冊應用程式後，「App Check」通常不會歸類為有效環境的應用程式。或是在持續整合 (CI) 環境中儲存在本機您就能為應用程式建立偵錯版本，該應用程式會使用 App Check 偵錯提供者而非真正的認證提供者。

請參閱「在網頁應用程式中搭配偵錯提供者使用 App Check」。

費用注意事項

「App Check」會代您建立評估作業，驗證使用者的每次執行網頁應用程式的瀏覽器重新整理 App Check 權杖。系統會依據已建立的每項評估作業，向您的專案收費超出免費配額請參閱 reCAPTCHA 定價。

根據預設，網頁應用程式每 1 小時會更新這個權杖兩次。目的地：控制應用程式更新 App Check 權杖的頻率 (進而經常建立新的評估作業)，請設定存留時間。