使用入门：将 App Check 与自定义提供方搭配使用（Web 应用）

本页介绍了如何使用自定义 App Check 提供方在 Web 应用中启用 App Check。启用 App Check 有助于确保只有您的应用可以访问项目的 Firebase 资源。

如果您希望将 App Check 与一个内置提供方搭配使用，请参阅有关将 App Check 与 reCAPTCHA Enterprise 搭配使用的文档。

准备工作

1. 将 App Check 库添加到您的应用中

将 Firebase 添加到您的 Web 应用（如果尚未添加）。请务必导入 App Check 库。

2. 创建 App Check 提供方对象

为您的自定义提供方创建 App Check 提供方对象。此对象必须具有 getToken() 方法，用于收集您的自定义 App Check 提供方作为真实性证明所需要的所有信息，并将其发送到令牌获取服务，以换取 App Check 令牌。App Check SDK 会处理令牌缓存，因此，请始终在您的 getToken() 实现中获取新令牌。

Web

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

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. 初始化 App Check

在访问任何 Firebase 服务之前，请将以下初始化代码添加到您的应用中：

Web

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

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 库安装到您的应用中之后，请部署该应用。

更新后的客户端应用会开始将 App Check 令牌随其发出的每个请求一起发送到 Firebase；不过，您在 Firebase 控制台的 App Check 部分中启用强制执行之前，Firebase 产品并不会要求令牌必须有效。

监控指标并启用强制执行

不过，在启用强制执行之前，您应该确保这样做不会干扰现有的合法用户。另一方面，如果您发现自己的应用资源被非法使用，建议您尽快启用强制执行。

为帮助您做出相关决策，建议您查看自己使用的服务的 App Check 指标：

启用 App Check 强制执行

在了解 App Check 对用户有何影响并为后续操作做好准备之后，您便可以启用 App Check 强制执行：

在调试环境中使用 App Check

为 App Check 注册应用后，如果您希望在 App Check 通常不会归类为有效提供方的环境（例如开发期间的本地环境）或持续集成 (CI) 环境中运行您的应用，可以创建应用的调试 build，该 build 使用 App Check 调试提供方，而不是真正的证明提供方。

请参阅将 App Check 与调试提供方搭配使用（Web 应用）。