अपने वेब ऐप्लिकेशन में बहु-स्तरीय पुष्टि (MFA) जोड़ें

अगर आपने Firebase Authentication with Identity Platform में अपग्रेड किया है, तो अपने वेब ऐप्लिकेशन में, मैसेज (एसएमएस) के ज़रिए कई चरणों में पुष्टि करने की सुविधा जोड़ी जा सकती है.

कई चरणों में पुष्टि करने की सुविधा से, आपके ऐप्लिकेशन की सुरक्षा बढ़ जाती है. अक्सर, हमलावर पासवर्ड और सोशल मीडिया खातों को हैक कर लेते हैं. हालांकि, मैसेज को इंटरसेप्ट करना ज़्यादा मुश्किल होता है.

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

  1. कम से कम एक ऐसा प्रोवाइडर चालू करें जो कई चरणों में पुष्टि करने की सुविधा के साथ काम करता हो. हर प्रोवाइडर, कई चरणों में पुष्टि करने की सुविधा के साथ काम करता है. हालांकि, फ़ोन से पुष्टि करने, गुमनाम तरीके से पुष्टि करने, और Apple Game Center से पुष्टि करने की सुविधा के साथ काम नहीं करता.

  2. उन इलाकों के लिए, मैसेज (एसएमएस) से पुष्टि करने की सुविधा चालू करें जहां इसका इस्तेमाल करना है. Firebase मैसेज (एसएमएस) से पुष्टि करने की सुविधा के लिए, पूरी तरह से ब्लॉक करने वाली नीति का इस्तेमाल करता है. इससे आपके प्रोजेक्ट डिफ़ॉल्ट रूप से ज़्यादा सुरक्षित तरीके से बनाए जा सकते हैं.

  3. पक्का करें कि आपका ऐप्लिकेशन, उपयोगकर्ताओं के ईमेल की पुष्टि कर रहा हो. MFA के लिए ईमेल पते की पुष्टि करना ज़रूरी है. इससे, गलत इरादे से काम करने वाले लोग, ऐसे ईमेल पते से किसी सेवा के लिए रजिस्टर नहीं कर पाते जिस पर उनका मालिकाना हक नहीं है. इसके बाद, वे पुष्टि करने का दूसरा चरण जोड़कर, असली मालिक को उसके खाते से बाहर कर देते हैं.

मल्टी-टेनेंसी का इस्तेमाल करना

अगर आपने मल्टी-टेनेंट एनवायरमेंट में इस्तेमाल करने के लिए, कई चरणों में पुष्टि करने की सुविधा चालू की है, तो इस दस्तावेज़ में दिए गए बाकी निर्देशों के अलावा, यह पक्का करें कि आपने ये चरण पूरे किए हों:

  1. Google Cloud Console में, वह किरायेदार चुनें जिसके लिए आपको काम करना है.

  2. अपने कोड में, Auth इंस्टेंस पर tenantId फ़ील्ड को अपने किरायेदार के आईडी पर सेट करें. उदाहरण के लिए:

    Web

    import { getAuth } from "firebase/auth";
    
    const auth = getAuth(app);
    auth.tenantId = "myTenantId1";
    

    Web

    firebase.auth().tenantId = 'myTenantId1';
    

कई चरणों में पुष्टि करने की सुविधा चालू करना

  1. Firebase console में, सुरक्षा > पुष्टि पर जाएं.

  2. साइन-इन करने का तरीका टैब में, बेहतर सेक्शन में जाकर, मैसेज (एसएमएस) के ज़रिए कई चरणों में पुष्टि करने की सुविधा चालू करें.

    आपको वे फ़ोन नंबर भी डालने चाहिए जिनसे अपने ऐप्लिकेशन की जांच करनी है. हालांकि, टेस्ट फ़ोन नंबर रजिस्टर करना ज़रूरी नहीं है. फिर भी, डेवलपमेंट के दौरान थ्रॉटलिंग से बचने के लिए, ऐसा करने का सुझाव दिया जाता है.

  3. अगर आपने अब तक अपने ऐप्लिकेशन के डोमेन को अनुमति नहीं दी है, तो ऐसा करें:

    1. Firebase console में, सुरक्षा > पुष्टि > सेटिंग टैब पर जाएं.

    2. अनुमति वाले डोमेन सेक्शन में, डोमेन जोड़ें पर क्लिक करें. इसके बाद, अपना डोमेन जोड़ें .

एनरॉलमेंट पैटर्न चुनना

आपके पास यह चुनने का विकल्प होता है कि आपके ऐप्लिकेशन के लिए, कई चरणों में पुष्टि करने की सुविधा ज़रूरी है या नहीं. साथ ही, यह भी तय किया जा सकता है कि उपयोगकर्ताओं को कब और कैसे रजिस्टर करना है. कुछ सामान्य पैटर्न यहां दिए गए हैं:

  • रजिस्ट्रेशन के दौरान, उपयोगकर्ता के दूसरे चरण की पुष्टि करने की सुविधा को एनरॉल करें. अगर आपके ऐप्लिकेशन के लिए, सभी उपयोगकर्ताओं के लिए कई चरणों में पुष्टि करने की सुविधा ज़रूरी है, तो इस तरीके का इस्तेमाल करें.

  • रजिस्ट्रेशन के दौरान, दूसरे चरण की पुष्टि करने की सुविधा को रजिस्टर करने के लिए, स्किप किया जा सकने वाला विकल्प दें. ऐसे ऐप्लिकेशन जो कई चरणों में पुष्टि करने की सुविधा को बढ़ावा देना चाहते हैं, लेकिन इसे ज़रूरी नहीं बनाना चाहते, वे इस तरीके को अपना सकते हैं.

  • साइन अप स्क्रीन के बजाय, उपयोगकर्ता के खाते या प्रोफ़ाइल मैनेजमेंट पेज से, दूसरे चरण की पुष्टि करने की सुविधा जोड़ने की अनुमति दें. इससे रजिस्ट्रेशन की प्रोसेस के दौरान होने वाली मुश्किलों को कम किया जा सकता है. साथ ही, सुरक्षा को लेकर संवेदनशील उपयोगकर्ताओं के लिए, कई चरणों में पुष्टि करने की सुविधा उपलब्ध कराई जा सकती है.

  • जब उपयोगकर्ता, सुरक्षा से जुड़ी ज़्यादा ज़रूरी शर्तों वाली सुविधाओं को ऐक्सेस करना चाहे, तो दूसरे चरण की पुष्टि करने की सुविधा को धीरे-धीरे जोड़ने की ज़रूरत होती है.

reCAPTCHA की पुष्टि करने वाला टूल सेट अप करना

मैसेज (एसएमएस) के ज़रिए कोड भेजने से पहले, आपको reCAPTCHA की पुष्टि करने वाला टूल कॉन्फ़िगर करना होगा. Firebase reCAPTCHA का इस्तेमाल करके, गलत इस्तेमाल को रोकता है. इसके लिए, यह पक्का किया जाता है कि फ़ोन नंबर की पुष्टि करने की सुविधा के अनुरोध, आपके ऐप्लिकेशन के अनुमति वाले डोमेन में से किसी एक से आएं.

आपको reCAPTCHA क्लाइंट को मैन्युअल तरीके से सेट अप करने की ज़रूरत नहीं है. क्लाइंट SDK का RecaptchaVerifier ऑब्जेक्ट, ज़रूरी क्लाइंट कुंजियां और सीक्रेट अपने-आप बनाता है और उन्हें शुरू करता है.

दिखाई न देने वाले reCAPTCHA का इस्तेमाल करना

RecaptchaVerifier ऑब्जेक्ट, दिखाई न देने वाले reCAPTCHA के साथ काम करता है. इससे अक्सर, उपयोगकर्ता के किसी भी इंटरैक्शन की ज़रूरत के बिना, उसकी पुष्टि की जा सकती है. दिखाई न देने वाले reCAPTCHA का इस्तेमाल करने के लिए, RecaptchaVerifier को size पैरामीटर के साथ invisible पर सेट करके बनाएं. इसके अलावा, यूज़र इंटरफ़ेस (यूआई) के उस एलिमेंट का आईडी डालें जिससे कई चरणों में पुष्टि करने की सुविधा का एनरॉलमेंट शुरू होता है:

Web

import { RecaptchaVerifier, getAuth } from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier(getAuth(), "sign-in-button", {
    "size": "invisible",
    "callback": function(response) {
        // reCAPTCHA solved, you can proceed with
        // phoneAuthProvider.verifyPhoneNumber(...).
        onSolvedRecaptcha();
    }
});

Web

var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
'size': 'invisible',
'callback': function(response) {
  // reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
  onSolvedRecaptcha();
}
});

reCAPTCHA विजेट का इस्तेमाल करना

दिखाई देने वाले reCAPTCHA विजेट का इस्तेमाल करने के लिए, विजेट को शामिल करने के लिए एक एचटीएमएल एलिमेंट बनाएं. इसके बाद, यूज़र इंटरफ़ेस (यूआई) कंटेनर के आईडी के साथ, RecaptchaVerifier ऑब्जेक्ट बनाएं. आपके पास, कॉल बैक सेट करने का विकल्प भी होता है. ये कॉल बैक, reCAPTCHA के हल होने या उसकी समयसीमा खत्म होने पर शुरू होते हैं:

Web

import { RecaptchaVerifier, getAuth } from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier(
    getAuth(),
    "recaptcha-container",

    // Optional reCAPTCHA parameters.
    {
      "size": "normal",
      "callback": function(response) {
        // reCAPTCHA solved, you can proceed with
        // phoneAuthProvider.verifyPhoneNumber(...).
        onSolvedRecaptcha();
      },
      "expired-callback": function() {
        // Response expired. Ask user to solve reCAPTCHA again.
        // ...
      }
    }
);

Web

var recaptchaVerifier = new firebase.auth.RecaptchaVerifier(
  'recaptcha-container',
  // Optional reCAPTCHA parameters.
  {
    'size': 'normal',
    'callback': function(response) {
      // reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
      // ...
      onSolvedRecaptcha();
    },
    'expired-callback': function() {
      // Response expired. Ask user to solve reCAPTCHA again.
      // ...
    }
  });

reCAPTCHA को पहले से रेंडर करना

आपके पास, दो चरणों में पुष्टि करने की सुविधा का एनरॉलमेंट शुरू करने से पहले, reCAPTCHA को पहले से रेंडर करने का विकल्प होता है:

Web

recaptchaVerifier.render()
    .then(function (widgetId) {
        window.recaptchaWidgetId = widgetId;
    });

Web

recaptchaVerifier.render()
  .then(function(widgetId) {
    window.recaptchaWidgetId = widgetId;
  });

render() के हल होने के बाद, आपको reCAPTCHA का विजेट आईडी मिलता है. इसका इस्तेमाल, reCAPTCHA API को कॉल करने के लिए किया जा सकता है:

var recaptchaResponse = grecaptcha.getResponse(window.recaptchaWidgetId);

RecaptchaVerifier, verify तरीके से इस लॉजिक को ऐब्स्ट्रैक्ट करता है. इसलिए, आपको grecaptcha वैरिएबल को सीधे तौर पर मैनेज करने की ज़रूरत नहीं होती.

दूसरे चरण की पुष्टि करने की सुविधा को एनरॉल करना

किसी उपयोगकर्ता के लिए, दूसरे चरण की पुष्टि करने की नई सुविधा को रजिस्टर करने के लिए:

  1. उपयोगकर्ता की फिर से पुष्टि करें.

  2. उपयोगकर्ता से उसका फ़ोन नंबर डालने के लिए कहें.

  3. पिछले सेक्शन में बताए गए तरीके से, reCAPTCHA की पुष्टि करने वाले टूल को शुरू करें. अगर RecaptchaVerifier इंस्टेंस पहले से कॉन्फ़िगर है, तो यह चरण छोड़ दें:

    Web

    import { RecaptchaVerifier, getAuth } from "firebase/auth";
    
    const recaptchaVerifier = new RecaptchaVerifier(
      getAuth(),'recaptcha-container-id', undefined);
    

    Web

    var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');
    
  4. उपयोगकर्ता के लिए, कई चरणों में पुष्टि करने का सेशन पाएं:

    Web

    import { multiFactor } from "firebase/auth";
    
    multiFactor(user).getSession().then(function (multiFactorSession) {
        // ...
    });
    

    Web

    user.multiFactor.getSession().then(function(multiFactorSession) {
      // ...
    })
    
  5. उपयोगकर्ता के फ़ोन नंबर और कई चरणों में पुष्टि करने के सेशन के साथ, PhoneInfoOptions ऑब्जेक्ट शुरू करें:

    Web

    // Specify the phone number and pass the MFA session.
    const phoneInfoOptions = {
      phoneNumber: phoneNumber,
      session: multiFactorSession
    };
    

    Web

    // Specify the phone number and pass the MFA session.
    var phoneInfoOptions = {
      phoneNumber: phoneNumber,
      session: multiFactorSession
    };
    
  6. उपयोगकर्ता के फ़ोन पर, पुष्टि करने का मैसेज भेजें:

    Web

    import { PhoneAuthProvider } from "firebase/auth";
    
    const phoneAuthProvider = new PhoneAuthProvider(auth);
    phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
        .then(function (verificationId) {
            // verificationId will be needed to complete enrollment.
        });
    

    Web

    var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
    // Send SMS verification code.
    return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
      .then(function(verificationId) {
        // verificationId will be needed for enrollment completion.
      })
    

    हालांकि, यह ज़रूरी नहीं है. फिर भी, उपयोगकर्ताओं को पहले से यह बताना सबसे सही तरीका है कि उन्हें मैसेज (एसएमएस) मिलेगा और इस पर सामान्य शुल्क लागू होंगे.

  7. अगर अनुरोध पूरा नहीं होता है, तो reCAPTCHA को रीसेट करें. इसके बाद, पिछला चरण दोहराएं, ताकि उपयोगकर्ता फिर से कोशिश कर सके. ध्यान दें कि verifyPhoneNumber() गड़बड़ी होने पर, reCAPTCHA को अपने-आप रीसेट कर देगा, क्योंकि reCAPTCHA टोकन का इस्तेमाल सिर्फ़ एक बार किया जा सकता है.

    Web

    recaptchaVerifier.clear();
    

    Web

    recaptchaVerifier.clear();
    
  8. मैसेज (एसएमएस) के ज़रिए कोड भेजने के बाद, उपयोगकर्ता से कोड की पुष्टि करने के लिए कहें:

    Web

    // Ask user for the verification code. Then:
    const cred = PhoneAuthProvider.credential(verificationId, verificationCode);
    

    Web

    // Ask user for the verification code. Then:
    var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);
    
  9. PhoneAuthCredential के साथ, MultiFactorAssertion ऑब्जेक्ट शुरू करें:

    Web

    import { PhoneMultiFactorGenerator } from "firebase/auth";
    
    const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);
    

    Web

    var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
    
  10. एनरॉलमेंट पूरा करें. आपके पास, दूसरे चरण की पुष्टि करने की सुविधा के लिए, डिसप्ले नेम तय करने का विकल्प होता है. यह उन उपयोगकर्ताओं के लिए काम का है जिनके पास दूसरे चरण की पुष्टि करने की एक से ज़्यादा सुविधाएं हैं, क्योंकि पुष्टि के फ़्लो के दौरान, फ़ोन नंबर मास्क किया जाता है. उदाहरण के लिए, +1******1234.

    Web

    // Complete enrollment. This will update the underlying tokens
    // and trigger ID token change listener.
    multiFactor(user).enroll(multiFactorAssertion, "My personal phone number");
    

    Web

    // Complete enrollment. This will update the underlying tokens
    // and trigger ID token change listener.
    user.multiFactor.enroll(multiFactorAssertion, 'My personal phone number');
    

नीचे दिया गया कोड, दूसरे चरण की पुष्टि करने की सुविधा को एनरॉल करने का पूरा उदाहरण दिखाता है:

Web

import {
    multiFactor, PhoneAuthProvider, PhoneMultiFactorGenerator,
    RecaptchaVerifier, getAuth
} from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier(getAuth(),
    'recaptcha-container-id', undefined);
multiFactor(user).getSession()
    .then(function (multiFactorSession) {
        // Specify the phone number and pass the MFA session.
        const phoneInfoOptions = {
            phoneNumber: phoneNumber,
            session: multiFactorSession
        };

        const phoneAuthProvider = new PhoneAuthProvider(auth);

        // Send SMS verification code.
        return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier);
    }).then(function (verificationId) {
        // Ask user for the verification code. Then:
        const cred = PhoneAuthProvider.credential(verificationId, verificationCode);
        const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);

        // Complete enrollment.
        return multiFactor(user).enroll(multiFactorAssertion, mfaDisplayName);
    });

Web

var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');
user.multiFactor.getSession().then(function(multiFactorSession) {
  // Specify the phone number and pass the MFA session.
  var phoneInfoOptions = {
    phoneNumber: phoneNumber,
    session: multiFactorSession
  };
  var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
  // Send SMS verification code.
  return phoneAuthProvider.verifyPhoneNumber(
      phoneInfoOptions, recaptchaVerifier);
})
.then(function(verificationId) {
  // Ask user for the verification code.
  var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);
  var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
  // Complete enrollment.
  return user.multiFactor.enroll(multiFactorAssertion, mfaDisplayName);
});

बधाई हो! आपने किसी उपयोगकर्ता के लिए, दूसरे चरण की पुष्टि करने की सुविधा को रजिस्टर कर लिया है.

दूसरे चरण की पुष्टि करने की सुविधा से उपयोगकर्ताओं को साइन इन कराना

मैसेज (एसएमएस) के ज़रिए दो चरणों में पुष्टि करने की सुविधा से, किसी उपयोगकर्ता को साइन इन कराने के लिए:

  1. उपयोगकर्ता को पहले चरण की पुष्टि करने की सुविधा से साइन इन कराएं. इसके बाद, auth/multi-factor-auth-required गड़बड़ी को पकड़ें. इस गड़बड़ी में, रिज़ॉल्वर, एनरॉल की गई दूसरे चरण की पुष्टि करने की सुविधाओं के बारे में जानकारी, और एक ऐसा सेशन शामिल होता है जिससे यह साबित होता है कि उपयोगकर्ता ने पहले चरण की पुष्टि करने की सुविधा से सफलतापूर्वक पुष्टि की है.

    उदाहरण के लिए, अगर उपयोगकर्ता का पहला चरण, ईमेल और पासवर्ड था:

    Web

    import { getAuth, signInWithEmailAndPassword, getMultiFactorResolver} from "firebase/auth";
    
    const auth = getAuth();
    signInWithEmailAndPassword(auth, email, password)
        .then(function (userCredential) {
            // User successfully signed in and is not enrolled with a second factor.
        })
        .catch(function (error) {
            if (error.code == 'auth/multi-factor-auth-required') {
                // The user is a multi-factor user. Second factor challenge is required.
                resolver = getMultiFactorResolver(auth, error);
                // ...
            } else if (error.code == 'auth/wrong-password') {
                // Handle other errors such as wrong password.
            }
    });
    

    Web

    firebase.auth().signInWithEmailAndPassword(email, password)
      .then(function(userCredential) {
        // User successfully signed in and is not enrolled with a second factor.
      })
      .catch(function(error) {
        if (error.code == 'auth/multi-factor-auth-required') {
          // The user is a multi-factor user. Second factor challenge is required.
          resolver = error.resolver;
          // ...
        } else if (error.code == 'auth/wrong-password') {
          // Handle other errors such as wrong password.
        } ...
      });
    

    अगर उपयोगकर्ता का पहला चरण, OAuth, SAML या OIDC जैसे फ़ेडरेटेड प्रोवाइडर से जुड़ा है, तो signInWithPopup() या signInWithRedirect() को कॉल करने के बाद, गड़बड़ी को पकड़ें.

  2. अगर उपयोगकर्ता ने दूसरे चरण की पुष्टि करने की एक से ज़्यादा सुविधाएं एनरॉल की हैं, तो उनसे पूछें कि उन्हें कौनसी सुविधा का इस्तेमाल करना है:

    Web

    // Ask user which second factor to use.
    // You can get the masked phone number via resolver.hints[selectedIndex].phoneNumber
    // You can get the display name via resolver.hints[selectedIndex].displayName
    
    if (resolver.hints[selectedIndex].factorId ===
        PhoneMultiFactorGenerator.FACTOR_ID) {
        // User selected a phone second factor.
        // ...
    } else if (resolver.hints[selectedIndex].factorId ===
               TotpMultiFactorGenerator.FACTOR_ID) {
        // User selected a TOTP second factor.
        // ...
    } else {
        // Unsupported second factor.
    }
    

    Web

    // Ask user which second factor to use.
    // You can get the masked phone number via resolver.hints[selectedIndex].phoneNumber
    // You can get the display name via resolver.hints[selectedIndex].displayName
    if (resolver.hints[selectedIndex].factorId === firebase.auth.PhoneMultiFactorGenerator.FACTOR_ID) {
      // User selected a phone second factor.
      // ...
    } else if (resolver.hints[selectedIndex].factorId === firebase.auth.TotpMultiFactorGenerator.FACTOR_ID) {
      // User selected a TOTP second factor.
      // ...
    } else {
      // Unsupported second factor.
    }
    
  3. पिछले सेक्शन में बताए गए तरीके से, reCAPTCHA की पुष्टि करने वाले टूल को शुरू करें. अगर RecaptchaVerifier इंस्टेंस पहले से कॉन्फ़िगर है, तो यह चरण छोड़ दें:

    Web

    import { RecaptchaVerifier, getAuth } from "firebase/auth";
    
    recaptchaVerifier = new RecaptchaVerifier(getAuth(),
        'recaptcha-container-id', undefined);
    

    Web

    var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');
    
  4. उपयोगकर्ता के फ़ोन नंबर और कई चरणों में पुष्टि करने के सेशन के साथ, PhoneInfoOptions ऑब्जेक्ट शुरू करें. ये वैल्यू, auth/multi-factor-auth-required गड़बड़ी को पास किए गए resolver ऑब्जेक्ट में शामिल होती हैं:

    Web

    const phoneInfoOptions = {
        multiFactorHint: resolver.hints[selectedIndex],
        session: resolver.session
    };
    

    Web

    var phoneInfoOptions = {
      multiFactorHint: resolver.hints[selectedIndex],
      session: resolver.session
    };
    
  5. उपयोगकर्ता के फ़ोन पर, पुष्टि करने का मैसेज भेजें:

    Web

    // Send SMS verification code.
    const phoneAuthProvider = new PhoneAuthProvider(auth);
    phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
        .then(function (verificationId) {
            // verificationId will be needed for sign-in completion.
        });
    

    Web

    var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
    // Send SMS verification code.
    return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
      .then(function(verificationId) {
        // verificationId will be needed for sign-in completion.
      })
    
  6. अगर अनुरोध पूरा नहीं होता है, तो reCAPTCHA को रीसेट करें. इसके बाद, पिछला चरण दोहराएं, ताकि उपयोगकर्ता फिर से कोशिश कर सके:

    Web

    recaptchaVerifier.clear();
    

    Web

    recaptchaVerifier.clear();
    
  7. मैसेज (एसएमएस) के ज़रिए कोड भेजने के बाद, उपयोगकर्ता से कोड की पुष्टि करने के लिए कहें:

    Web

    const cred = PhoneAuthProvider.credential(verificationId, verificationCode);
    

    Web

    // Ask user for the verification code. Then:
    var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);
    
  8. PhoneAuthCredential के साथ, MultiFactorAssertion ऑब्जेक्ट शुरू करें:

    Web

    const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);
    

    Web

    var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
    
  9. दूसरे चरण की पुष्टि करने की सुविधा को पूरा करने के लिए, resolver.resolveSignIn() को कॉल करें. इसके बाद, साइन-इन के असली नतीजे को ऐक्सेस किया जा सकता है. इसमें, प्रोवाइडर के हिसाब से स्टैंडर्ड डेटा और पुष्टि के क्रेडेंशियल शामिल होते हैं:

    Web

    // Complete sign-in. This will also trigger the Auth state listeners.
    resolver.resolveSignIn(multiFactorAssertion)
        .then(function (userCredential) {
            // userCredential will also contain the user, additionalUserInfo, optional
            // credential (null for email/password) associated with the first factor sign-in.
    
            // For example, if the user signed in with Google as a first factor,
            // userCredential.additionalUserInfo will contain data related to Google
            // provider that the user signed in with.
            // - user.credential contains the Google OAuth credential.
            // - user.credential.accessToken contains the Google OAuth access token.
            // - user.credential.idToken contains the Google OAuth ID token.
        });
    

    Web

    // Complete sign-in. This will also trigger the Auth state listeners.
    resolver.resolveSignIn(multiFactorAssertion)
      .then(function(userCredential) {
        // userCredential will also contain the user, additionalUserInfo, optional
        // credential (null for email/password) associated with the first factor sign-in.
        // For example, if the user signed in with Google as a first factor,
        // userCredential.additionalUserInfo will contain data related to Google provider that
        // the user signed in with.
        // user.credential contains the Google OAuth credential.
        // user.credential.accessToken contains the Google OAuth access token.
        // user.credential.idToken contains the Google OAuth ID token.
      });
    

नीचे दिया गया कोड, कई चरणों में पुष्टि करने की सुविधा का इस्तेमाल करने वाले उपयोगकर्ता को साइन इन कराने का पूरा उदाहरण दिखाता है:

Web

import {
    getAuth,
    getMultiFactorResolver,
    PhoneAuthProvider,
    PhoneMultiFactorGenerator,
    RecaptchaVerifier,
    signInWithEmailAndPassword
} from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier(getAuth(),
    'recaptcha-container-id', undefined);

const auth = getAuth();
signInWithEmailAndPassword(auth, email, password)
    .then(function (userCredential) {
        // User is not enrolled with a second factor and is successfully
        // signed in.
        // ...
    })
    .catch(function (error) {
        if (error.code == 'auth/multi-factor-auth-required') {
            const resolver = getMultiFactorResolver(auth, error);
            // Ask user which second factor to use.
            if (resolver.hints[selectedIndex].factorId ===
                PhoneMultiFactorGenerator.FACTOR_ID) {
                const phoneInfoOptions = {
                    multiFactorHint: resolver.hints[selectedIndex],
                    session: resolver.session
                };
                const phoneAuthProvider = new PhoneAuthProvider(auth);
                // Send SMS verification code
                return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
                    .then(function (verificationId) {
                        // Ask user for the SMS verification code. Then:
                        const cred = PhoneAuthProvider.credential(
                            verificationId, verificationCode);
                        const multiFactorAssertion =
                            PhoneMultiFactorGenerator.assertion(cred);
                        // Complete sign-in.
                        return resolver.resolveSignIn(multiFactorAssertion)
                    })
                    .then(function (userCredential) {
                        // User successfully signed in with the second factor phone number.
                    });
            } else if (resolver.hints[selectedIndex].factorId ===
                       TotpMultiFactorGenerator.FACTOR_ID) {
                // Handle TOTP MFA.
                // ...
            } else {
                // Unsupported second factor.
            }
        } else if (error.code == 'auth/wrong-password') {
            // Handle other errors such as wrong password.
        }
    });

Web

var resolver;
firebase.auth().signInWithEmailAndPassword(email, password)
  .then(function(userCredential) {
    // User is not enrolled with a second factor and is successfully signed in.
    // ...
  })
  .catch(function(error) {
    if (error.code == 'auth/multi-factor-auth-required') {
      resolver = error.resolver;
      // Ask user which second factor to use.
      if (resolver.hints[selectedIndex].factorId ===
          firebase.auth.PhoneMultiFactorGenerator.FACTOR_ID) {
        var phoneInfoOptions = {
          multiFactorHint: resolver.hints[selectedIndex],
          session: resolver.session
        };
        var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
        // Send SMS verification code
        return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
          .then(function(verificationId) {
            // Ask user for the SMS verification code.
            var cred = firebase.auth.PhoneAuthProvider.credential(
                verificationId, verificationCode);
            var multiFactorAssertion =
                firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
            // Complete sign-in.
            return resolver.resolveSignIn(multiFactorAssertion)
          })
          .then(function(userCredential) {
            // User successfully signed in with the second factor phone number.
          });
      } else if (resolver.hints[selectedIndex].factorId ===
        firebase.auth.TotpMultiFactorGenerator.FACTOR_ID) {
        // Handle TOTP MFA.
        // ...
      } else {
        // Unsupported second factor.
      }
    } else if (error.code == 'auth/wrong-password') {
      // Handle other errors such as wrong password.
    } ...
  });

बधाई हो! आपने कई चरणों में पुष्टि करने की सुविधा का इस्तेमाल करके, किसी उपयोगकर्ता को सफलतापूर्वक साइन इन करा लिया है.

आगे क्या करना है