Join us for Firebase Summit on November 10, 2021. Tune in to learn how Firebase can help you accelerate app development, release with confidence, and scale with ease. Register

使用 Web 应用中的 App Check 保护非 Firebase 资源

您可以使用 App Check 保护应用的非 Firebase 资源,例如自托管后端。为此,您需要执行以下两项操作:

  • 修改您的应用程序客户端以将 App Check 令牌与每个请求一起发送到您的后端,如本页所述。
  • 修改后端需要一个有效的应用程序令牌检查每个请求,如在从定制后端验证应用程序检查令牌

在你开始之前

添加应用程序检查到您的应用程序,将使用默认的reCAPTCHA V3提供商,或自定义提供

使用后端请求发送 App Check 令牌

在您的应用程序客户端,每个请求之前,获得一个有效的,未过期的,应用程序检查与令牌appCheck().getToken()如有必要,App Check 库将刷新令牌。

获得有效令牌后,将其与请求一起发送到后端。你是如何做到这一点的细节是你的,但不发送应用程序检查令牌作为网址的一部分,包括在查询参数,因为这使得他们很容易受到意外泄漏和拦截。以下示例在自定义 HTTP 标头中发送令牌,这是推荐的方法。

网页版 9

const { initializeAppCheck, getToken } = require('firebase/app-check');

const appCheck = initializeAppCheck(
    app,
    { provider: provider } // ReCaptchaV3Provider or CustomProvider
);

const callApiWithAppCheckExample = async () => {
  let appCheckTokenResponse;
  try {
      appCheckTokenResponse = await getToken(appCheck, /* forceRefresh= */ false);
  } catch (err) {
      // Handle any errors if the token was not retrieved.
      return;
  }

  // Include the App Check token with requests to your server.
  const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {
      headers: {
          'X-Firebase-AppCheck': appCheckTokenResponse.token,
      }
  });

  // Handle response from your backend.
};

网页版 8

const callApiWithAppCheckExample = async () => {
  let appCheckTokenResponse;
  try {
      appCheckTokenResponse = await firebase.appCheck().getToken(/* forceRefresh= */ false);
  } catch (err) {
      // Handle any errors if the token was not retrieved.
      return;
  }

  // Include the App Check token with requests to your server.
  const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {
      headers: {
          'X-Firebase-AppCheck': appCheckTokenResponse.token,
      }
  });

  // Handle response from your backend.
};