Benutzerdefinierte Backend-Ressourcen in Web-Apps mit App Check schützen

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Sie können App Check verwenden, um benutzerdefinierte Backend-Ressourcen von Drittanbietern für Ihre App zu schützen, z. B. Ihr eigenes gehostetes Backend. Gehen Sie dazu so vor:

• Ändern Sie Ihren App-Client so, dass er mit jeder Anfrage ein App Check-Token an Ihr Backend sendet, wie auf dieser Seite beschrieben.
• Ändern Sie Ihr Backend so, dass für jede Anfrage ein gültiges App Check-Token erforderlich ist, wie unter App Check-Tokens aus einem benutzerdefinierten Backend überprüfen beschrieben.

Hinweis

Fügen Sie App Check Ihrer App hinzu. Verwenden Sie dazu entweder den reCAPTCHA Enterprise-Anbieter oder einen benutzerdefinierten Anbieter.

App Check-Tokens mit Backendanfragen senden

Rufen Sie in Ihrem App-Client vor jeder Anfrage ein gültiges, nicht abgelaufenes App Check-Token mit appCheck().getToken() ab. Die App Check-Bibliothek aktualisiert das Token bei Bedarf.

Sobald du ein gültiges Token hast, sende es zusammen mit der Anfrage an dein Backend. Wie Sie dies erreichen, liegt in Ihrem Ermessen. Senden Sie App Check-Tokens jedoch nicht als Teil von URLs, einschließlich in Abfrageparametern, da sie dadurch anfällig für versehentliches Leck und Abfangen sind. Im folgenden Beispiel wird das Token in einem benutzerdefinierten HTTP-Header gesendet. Dies ist die empfohlene Vorgehensweise.

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

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

Replay-Schutz (Beta)

Wenn du eine Anfrage an einen Endpunkt sendest, für den du den Replay-Schutz aktiviert hast, musst du ein Token mit getLimitedUseToken() statt getToken() abrufen:

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

// ...

appCheckTokenResponse = await getLimitedUseToken(appCheck);