開始在 Web 應用程式上使用自訂提供者的 App Check

此頁面向您展示如何使用自訂 App Check 提供者在 Web 應用程式中啟用 App Check。啟用應用程式檢查後，您可以協助確保只有您的應用程式可以存取專案的 Firebase 資源。

如果您想將 App Check 與內建提供者之一一起使用，請參閱App Check 與 reCAPTCHA Enterprise的文檔。

在你開始之前

1. 將 App Check 庫加入您的應用程式中

如果您尚未將 Firebase 新增至您的網路應用程式中，請將其新增至您的網路應用程式。請務必導入 App Check 庫。

2. 建立 App Check 提供者對象

為您的自訂提供者建立 App Check 提供者物件。該物件必須具有getToken()方法，該方法收集您的自訂 App Check 提供者所需的任何資訊作為真實性證明，並將其發送到您的令牌獲取服務以換取 App Check 令牌。 App Check SDK 處理令牌緩存，因此始終在getToken()的實作中取得新令牌。

Web modular API

import { CustomProvider } from "firebase/app-check";

const appCheckCustomProvider = new CustomProvider({
  getToken: () => {
    return new Promise((resolve, _reject) => {
      // TODO: Logic to exchange proof of authenticity for an App Check token and
      // expiration time.

      // ...

      const appCheckToken = {
        token: tokenFromServer,
        expireTimeMillis: expirationFromServer * 1000
      };

      resolve(appCheckToken);
    });
  }
});
appcheck_custom_provider.js

Web namespaced API

const appCheckCustomProvider = {
  getToken: () => {
    return new Promise((resolve, _reject) => {
      // TODO: Logic to exchange proof of authenticity for an App Check token and
      // expiration time.

      // ...

      const appCheckToken = {
        token: tokenFromServer,
        expireTimeMillis: expirationFromServer * 1000
      };

      resolve(appCheckToken);
    });
  }
};
index.js

3. 初始化應用檢查

在存取任何 Firebase 服務之前，將以下初始化程式碼新增至您的應用程式：

Web modular API

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

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

const appCheck = initializeAppCheck(app, {
  provider: appCheckCustomProvider,

  // Optional argument. If true, the SDK automatically refreshes App Check
  // tokens as needed.
  isTokenAutoRefreshEnabled: true    
});
appcheck_initialize_custom_provider.js

Web namespaced API

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

const appCheck = firebase.appCheck();
appCheck.activate(
  appCheckCustomProvider,

  // Optional argument. If true, the SDK automatically refreshes App Check
  // tokens as needed.
  true);
index.js

下一步

將 App Check 庫安裝到您的應用程式後，進行部署。

更新後的客戶端應用程式將開始隨其向Firebase 發出的每個請求一起發送App Check 令牌，但在您在Firebase 控制台的App Check 部分中啟用強制執行之前，Firebase 產品不會要求令牌有效。

監控指標並啟用執行

但是，在啟用強制執行之前，您應該確保這樣做不會幹擾您現有的合法使用者。另一方面，如果您發現應用程式資源的可疑使用，您可能希望盡快啟用強制執行。

為了幫助做出此決定，您可以查看您使用的服務的 App Check 指標：

啟用應用程式檢查強制執行

當您了解 App Check 將如何影響您的使用者並且準備好繼續操作後，您可以啟用 App Check 強制執行：

在調試環境中使用 App Check

如果在為App Check 註冊您的應用程式後，您希望在App Check 通常不會歸類為有效的環境中運行您的應用程序，例如在開發期間本地運行，或者在持續集成(CI) 環境中運行，您可以建立應用程式的偵錯版本，使用 App Check 偵錯提供者而不是真正的證明提供者。

請參閱在 Web 應用程式中使用 App Check 與偵錯提供者。