Web uygulamalarında App Check ile özel arka uç kaynaklarını koruma

Uygulamanız için Google dışı özel arka uç kaynaklarını (ör. kendi kendine barındırılan arka ucunuz) korumak üzere App Check kullanabilirsiniz. Bunun için aşağıdakilerin ikisini de yapmanız gerekir:

  • Uygulama istemcinizi, arka uçunuza gönderilen her istekle birlikte App Check jetonu gönderecek şekilde değiştirin. Bu işlem, bu sayfada açıklanmıştır.
  • Arka ucunuzu, Özel bir arka uçtan gelen App Check jetonlarını doğrulama bölümünde açıklandığı gibi, her istekte 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 jetonları gönderme

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

Geçerli bir jetonunuz olduğunda, istekle birlikte arka ucunuza gönderin. Bunu nasıl yapacağınız size bağlıdır ancak URL'lerin bir parçası olarak App Check jetonları göndermeyin. Bu, sorgu parametreleri de dahil olmak üzere jetonların yanlışlıkla sızdırılmasına ve saldırıya uğramasına neden olur. Aşağıdaki örnekte, jetonun özel bir HTTP üstbilgisinde gönderildiği gösterilmektedir. Bu, önerilen yaklaşımdır.

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 koruması (beta)

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

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

// ...

appCheckTokenResponse = await getLimitedUseToken(appCheck);