Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

通過 Web 應用程序上的自定義提供程序開始使用 App Check

透過集合功能整理內容 你可以依據偏好儲存及分類內容。

此頁面向您展示如何使用您的自定義 App Check 提供程序在 Web 應用程序中啟用 App Check。當您啟用 App Check 時,您有助於確保只有您的應用可以訪問您項目的 Firebase 資源。

如果您想通過其中一個內置提供程序使用 App Check,請參閱有關使用 reCAPTCHA v3進行App Check 和使用 reCAPTCHA Enterprise進行 App Check 的文檔。

在你開始之前

1.將App Check庫添加到您的應用中

如果您還沒有將 Firebase 添加到您的網絡應用程序。請務必導入 App Check 庫。

2.創建App Check提供者對象

為您的自定義提供程序創建一個 App Check 提供程序對象。該對象必須有一個getToken()方法,該方法收集您的自定義 App Check 提供商需要的任何信息作為真實性證明,並將其發送到您的令牌獲取服務以換取 App Check 令牌。 App Check SDK 處理令牌緩存,因此始終在您的getToken()實現中獲取新令牌。

Web version 9

const { CustomProvider } = require("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);
    });
  }
});

Web version 8

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);
    });
  }
};

3.初始化App Check

在您訪問任何 Firebase 服務之前,將以下初始化代碼添加到您的應用程序中:

Web version 9

const { initializeApp } = require("firebase/app");
const { initializeAppCheck } = require("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    
});

Web version 8

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);

下一步

在您的應用程序中安裝 App Check 庫後,部署它。

更新後的客戶端應用程序將開始發送 App Check 令牌及其向 Firebase 發出的每個請求,但 Firebase 產品不會要求令牌有效,直到您在 Firebase 控制台的 App Check 部分啟用強制執行。

監控指標並啟用強制執行

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

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

啟用 App Check 強制執行

當您了解 App Check 將如何影響您的用戶並準備好繼續操作時,您可以啟用 App Check 強制執行:

在調試環境中使用 App Check

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

請參閱在 Web 應用程序中將 App Check 與調試提供程序一起使用

,

此頁面向您展示如何使用您的自定義 App Check 提供程序在 Web 應用程序中啟用 App Check。當您啟用 App Check 時,您有助於確保只有您的應用可以訪問您項目的 Firebase 資源。

如果您想通過其中一個內置提供程序使用 App Check,請參閱有關使用 reCAPTCHA v3進行App Check 和使用 reCAPTCHA Enterprise進行 App Check 的文檔。

在你開始之前

1.將App Check庫添加到您的應用中

如果您還沒有將 Firebase 添加到您的網絡應用程序。請務必導入 App Check 庫。

2.創建App Check提供者對象

為您的自定義提供程序創建一個 App Check 提供程序對象。該對象必須有一個getToken()方法,該方法收集您的自定義 App Check 提供商需要的任何信息作為真實性證明,並將其發送到您的令牌獲取服務以換取 App Check 令牌。 App Check SDK 處理令牌緩存,因此始終在您的getToken()實現中獲取新令牌。

Web version 9

const { CustomProvider } = require("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);
    });
  }
});

Web version 8

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);
    });
  }
};

3.初始化App Check

在您訪問任何 Firebase 服務之前,將以下初始化代碼添加到您的應用程序中:

Web version 9

const { initializeApp } = require("firebase/app");
const { initializeAppCheck } = require("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    
});

Web version 8

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);

下一步

在您的應用程序中安裝 App Check 庫後,部署它。

更新後的客戶端應用程序將開始發送 App Check 令牌及其向 Firebase 發出的每個請求,但 Firebase 產品不會要求令牌有效,直到您在 Firebase 控制台的 App Check 部分啟用強制執行。

監控指標並啟用強制執行

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

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

啟用 App Check 強制執行

當您了解 App Check 將如何影響您的用戶並準備好繼續操作時,您可以啟用 App Check 強制執行:

在調試環境中使用 App Check

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

請參閱在 Web 應用程序中將 App Check 與調試提供程序一起使用