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

App Check ile uygulamanızın Firebase dışındaki kaynaklarını (ör. kendi bünyesinde barındırılan arka uçlar) koruyabilirsiniz. Bunun için aşağıdakilerin ikisini birden yapmanız gerekir:

  • Uygulama istemcinizi, bu sayfada açıklandığı gibi arka uçunuza her istekle birlikte bir App Check jetonu gönderecek şekilde değiştirin.
  • Arka uçunuzu, Özel arka uçtan App Check jetonlarını doğrulama bölümünde açıklandığı gibi her istek için geçerli bir App Check jetonu gerektirecek şekilde değiştirin.

Başlamadan önce

reCAPTCHA Enterprise sağlayıcısını veya özel bir sağlayıcıyı kullanarak uygulamanıza App Check ekleyin.

Arka uç istekleriyle App Check jeton gönder

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

Geçerli bir jeton aldıktan sonra isteği arka ucunuza jetonla birlikte gönderin. Bunu nasıl yapacağınız size bağlıdır ancak App Check jetonlarını URL'lerin bir parçası olarak göndermeyin. Sorgu parametreleri de dahil olmak üzere URL'lere eklenmiş jetonlar, yanlışlıkla sızıntıya ve müdahaleye açık hale gelir. Aşağıdaki örnekte, jeton önerilen yaklaşım olan özel bir HTTP üstbilgisinde gönderilmektedir.

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

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

Tekrar koruması (beta)

Tekrar oynatma korumasını etkinleştirdiğiniz bir uç noktaya istek gönderirken getToken() yerine getLimitedUseToken() kullanarak jeton edinin:

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

// ...

appCheckTokenResponse = await getLimitedUseToken(appCheck);