Web uygulamalarında Uygulama Kontrolü ile Firebase dışı kaynakları koruyun

Uygulamanızın kendi bünyesinde barındırılan arka uçlar gibi Firebase dışı kaynaklarını koruyabilirsiniz. App Check ile birlikte. Bunun için aşağıdakilerin ikisini de yapmanız gerekir:

  • Uygulama istemcinizi her istekle birlikte bir App Check jetonu gönderecek şekilde değiştirin arka ucunuza gönderin.
  • Arka ucunuzu her istekte geçerli bir App Check jetonu gerektirecek şekilde değiştirin. Özel arka uçtan App Check jetonlarını doğrulama bölümünde açıklandığı gibi.

Başlamadan önce

Şu yöntemlerden birini kullanarak App Check uygulamasını uygulamanıza ekleyin: reCAPTCHA Enterprise sağlayıcısı veya özel sağlayıcı.

Arka uç istekleriyle App Check jeton gönder

Uygulama istemcinizde, her istekten önce geçerli ve süresi dolmamış bir App Check alın appCheck().getToken() ile jeton. App Check kitaplığı, belirtmelisiniz.

Geçerli bir jeton edindikten sonra bu jetonu istekle birlikte arka ucunuza gönderin. İlgili içeriği oluşturmak için kullanılan bunu nasıl başaracağınıza ilişkin ayrıntılar size bağlıdır ancak bilgilere Sorgu parametreleri dahil olmak üzere, URL'lerin bir parçası olarak App Check jeton bu cihazlar kazayla sızıntılara ve müdahaleye karşı savunmasız hale gelir. Aşağıdakiler kodu özel bir HTTP üst bilgisinde gönderir. Bu örneğin, bahsedeceğiz.

Web

import { initializeAppCheck, getToken } from '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.
};

Web

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

Tekrar oynatma koruması (beta)

Etkinleştirdiğiniz bir uç noktaya istekte bulunurken oynatma koruması, getToken() yerine getLimitedUseToken() kullanarak bir jeton alın:

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

// ...

appCheckTokenResponse = await getLimitedUseToken(appCheck);