वेब ऐप्लिकेशन में, ऐप्लिकेशन की जांच की सुविधा की मदद से कस्टम बैकएंड संसाधनों को सुरक्षित रखना

App Check का इस्तेमाल करके, अपने ऐप्लिकेशन के लिए Google के अलावा, कस्टम बैकएंड के संसाधनों को सुरक्षित किया जा सकता है. जैसे, आपका अपना सेल्फ-होस्टेड बैकएंड. इसके लिए, आपको ये दोनों काम करने होंगे:

अपने ऐप्लिकेशन क्लाइंट में बदलाव करें, ताकि वह आपके बैकएंड को हर अनुरोध के साथ App Check टोकन भेजे . इसके बारे में इस पेज पर बताया गया है.
अपने बैकएंड में बदलाव करें, ताकि हर अनुरोध के साथ मान्य App Check टोकन की ज़रूरत हो. इसके बारे में, कस्टम बैकएंड से App Check टोकन की पुष्टि करना लेख में बताया गया है.

शुरू करने से पहले

अपने ऐप्लिकेशन में App Check जोड़ें. इसके लिए, या तो reCAPTCHA Enterprise प्रोवाइडर या कस्टम प्रोवाइडर का इस्तेमाल करें.

बैकएंड के अनुरोधों के साथ App Check टोकन भेजना

अपने ऐप्लिकेशन क्लाइंट में, हर अनुरोध से पहले, मान्य और समयसीमा खत्म न हुआ App Check टोकन पाएं.appCheck().getToken() अगर ज़रूरी हो, तो App Check लाइब्रेरी टोकन को रीफ़्रेश करेगी.

मान्य टोकन मिलने के बाद, इसे अपने बैकएंड को अनुरोध के साथ भेजें. इसे पूरा करने का तरीका आपके ऊपर है. हालांकि, टोकन को यूआरएल के हिस्से के तौर पर न भेजें. इनमें क्वेरी पैरामीटर भी शामिल हैं. ऐसा करने से, ये टोकन गलती से लीक हो सकते हैं और इन्हें इंटरसेप्ट किया जा सकता है.App Check यहां दिए गए उदाहरण में, टोकन को कस्टम एचटीटीपी हेडर में भेजा गया है. यह तरीका इस्तेमाल करने का सुझाव दिया जाता है.

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

रिप्ले प्रोटेक्शन (बीटा वर्शन)

किसी ऐसे एंडपॉइंट के लिए अनुरोध करते समय जिसके लिए आपने रिप्ले प्रोटेक्शन की सुविधा चालू की है, getLimitedUseToken() के बजाय getToken() का इस्तेमाल करके टोकन पाएं:

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

// ...

appCheckTokenResponse = await getLimitedUseToken(appCheck);