यदि आपने पहचान प्लेटफ़ॉर्म के साथ फायरबेस प्रमाणीकरण में अपग्रेड किया है, तो आप अपने वेब ऐप में एसएमएस बहु-कारक प्रमाणीकरण जोड़ सकते हैं।
मल्टी-फैक्टर ऑथेंटिकेशन आपके ऐप की सुरक्षा बढ़ाता है। जबकि हमलावर अक्सर पासवर्ड और सामाजिक खातों से छेड़छाड़ करते हैं, पाठ संदेश को रोकना अधिक कठिन होता है।
शुरू करने से पहले
बहु-कारक प्रमाणीकरण का समर्थन करने वाले कम से कम एक प्रदाता को सक्षम करें। फ़ोन प्रमाणन, अनाम प्रमाणीकरण और Apple गेम सेंटर को छोड़कर प्रत्येक प्रदाता MFA का समर्थन करता है।
सुनिश्चित करें कि आपका ऐप उपयोगकर्ता ईमेल सत्यापित कर रहा है। एमएफए को ईमेल सत्यापन की आवश्यकता है। यह दुर्भावनापूर्ण अभिनेताओं को उस ईमेल के साथ सेवा के लिए पंजीकरण करने से रोकता है जो उनके पास नहीं है, और फिर दूसरा कारक जोड़कर वास्तविक स्वामी को लॉक कर देता है।
मल्टी-टेनेंसी का उपयोग करना
यदि आप बहु-किरायेदार वातावरण में उपयोग के लिए बहु-कारक प्रमाणीकरण सक्षम कर रहे हैं, तो निम्न चरणों को पूरा करना सुनिश्चित करें (इस दस्तावेज़ में शेष निर्देशों के अतिरिक्त):
GCP कंसोल में, उस टैनेंट का चयन करें जिसके साथ आप काम करना चाहते हैं।
अपने कोड में, अपने टेनेंट की आईडी के लिए
Auth
उदाहरण परtenantId
फ़ील्ड सेट करें। उदाहरण के लिए:वेब मॉड्यूलर एपीआई
import { getAuth } from "firebase/auth"; const auth = getAuth(app); auth.tenantId = "myTenantId1";
वेब नेमस्पेस्ड एपीआई
firebase.auth().tenantId = 'myTenantId1';
बहु-कारक प्रमाणीकरण सक्षम करना
फायरबेस कंसोल का ऑथेंटिकेशन> साइन-इन मेथड पेज खोलें।
उन्नत अनुभाग में, SMS बहु-कारक प्रमाणीकरण सक्षम करें।
आपको वे फ़ोन नंबर भी दर्ज करने चाहिए जिनसे आप अपने ऐप का परीक्षण करेंगे। वैकल्पिक होते हुए, विकास के दौरान थ्रॉटलिंग से बचने के लिए परीक्षण फ़ोन नंबर दर्ज करने की पुरजोर अनुशंसा की जाती है।
यदि आपने अपने ऐप के डोमेन को पहले से अधिकृत नहीं किया है, तो इसे फायरबेस कंसोल के प्रमाणीकरण > सेटिंग पृष्ठ पर अनुमति सूची में जोड़ें।
एक नामांकन पैटर्न चुनना
आप यह चुन सकते हैं कि आपके ऐप को बहु-कारक प्रमाणीकरण की आवश्यकता है या नहीं, और अपने उपयोगकर्ताओं को कैसे और कब नामांकित करना है। कुछ सामान्य पैटर्न में शामिल हैं:
पंजीकरण के हिस्से के रूप में उपयोगकर्ता के दूसरे कारक को नामांकित करें। यदि आपके ऐप को सभी उपयोगकर्ताओं के लिए बहु-कारक प्रमाणीकरण की आवश्यकता है, तो इस विधि का उपयोग करें।
पंजीकरण के दौरान दूसरे कारक को नामांकित करने के लिए स्किप करने योग्य विकल्प प्रदान करें। ऐसे ऐप्स जो प्रोत्साहित करना चाहते हैं, लेकिन बहु-कारक प्रमाणीकरण की आवश्यकता नहीं है, वे इस दृष्टिकोण को पसंद कर सकते हैं।
साइन अप स्क्रीन के बजाय उपयोगकर्ता के खाते या प्रोफ़ाइल प्रबंधन पृष्ठ से दूसरा कारक जोड़ने की क्षमता प्रदान करें। यह सुरक्षा-संवेदनशील उपयोगकर्ताओं के लिए बहु-कारक प्रमाणीकरण उपलब्ध कराते हुए पंजीकरण प्रक्रिया के दौरान घर्षण को कम करता है।
जब उपयोगकर्ता बढ़ी हुई सुरक्षा आवश्यकताओं के साथ सुविधाओं का उपयोग करना चाहता है तो दूसरे कारक को वृद्धिशील रूप से जोड़ने की आवश्यकता होती है।
रीकैप्चा सत्यापनकर्ता की स्थापना
इससे पहले कि आप एसएमएस कोड भेज सकें, आपको एक रीकैप्चा सत्यापनकर्ता को कॉन्फ़िगर करना होगा। Firebase यह सुनिश्चित करके दुरुपयोग को रोकने के लिए reCAPTCHA का उपयोग करता है कि फ़ोन नंबर सत्यापन अनुरोध आपके ऐप के अनुमत डोमेन में से एक से आते हैं।
आपको मैन्युअल रूप से reCAPTCHA क्लाइंट सेट अप करने की आवश्यकता नहीं है; क्लाइंट SDK का RecaptchaVerifier
ऑब्जेक्ट स्वचालित रूप से किसी भी आवश्यक क्लाइंट कुंजियों और रहस्यों को बनाता और आरंभ करता है।
अदृश्य रीकैप्चा का उपयोग करना
RecaptchaVerifier
ऑब्जेक्ट अदृश्य reCAPTCHA का समर्थन करता है, जो अक्सर किसी भी इंटरैक्शन की आवश्यकता के बिना उपयोगकर्ता को सत्यापित कर सकता है। किसी अदृश्य reCAPTCHA का उपयोग करने के लिए, size
पैरामीटर के साथ एक RecaptchaVerifier
बनाएं, जिसे invisible
पर सेट किया गया हो, और उस UI तत्व की आईडी निर्दिष्ट करें जो बहु-कारक नामांकन शुरू करता है:
वेब मॉड्यूलर एपीआई
import { RecaptchaVerifier } from "firebase/auth";
const recaptchaVerifier = new RecaptchaVerifier("sign-in-button", {
"size": "invisible",
"callback": function(response) {
// reCAPTCHA solved, you can proceed with
// phoneAuthProvider.verifyPhoneNumber(...).
onSolvedRecaptcha();
}
}, auth);
वेब नेमस्पेस्ड एपीआई
var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
'size': 'invisible',
'callback': function(response) {
// reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
onSolvedRecaptcha();
}
});
रीकैप्चा विजेट का उपयोग करना
दृश्यमान रीकैप्चा विजेट का उपयोग करने के लिए, विजेट को शामिल करने के लिए एक HTML तत्व बनाएं, फिर UI कंटेनर की आईडी के साथ एक RecaptchaVerifier
ऑब्जेक्ट बनाएं। आप वैकल्पिक रूप से कॉलबैक भी सेट कर सकते हैं जो रीकैप्चा के हल होने या समाप्त होने पर लागू होते हैं:
वेब मॉड्यूलर एपीआई
import { RecaptchaVerifier } from "firebase/auth";
const recaptchaVerifier = new 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.
// ...
}
}, auth
);
वेब नेमस्पेस्ड एपीआई
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.
// ...
}
});
रीकैप्चा का प्री-रेंडरिंग
वैकल्पिक रूप से, आप दो-कारक नामांकन शुरू करने से पहले रीकैप्चा को प्री-रेंडर कर सकते हैं:
वेब मॉड्यूलर एपीआई
recaptchaVerifier.render()
.then(function (widgetId) {
window.recaptchaWidgetId = widgetId;
});
वेब नेमस्पेस्ड एपीआई
recaptchaVerifier.render()
.then(function(widgetId) {
window.recaptchaWidgetId = widgetId;
});
render()
हल करने के बाद, आपको रीकैप्चा की विजेट आईडी मिलती है, जिसका उपयोग आप रीकैप्चा एपीआई को कॉल करने के लिए कर सकते हैं:
var recaptchaResponse = grecaptcha.getResponse(window.recaptchaWidgetId);
RecaptchaVerifier इस तर्क को सत्यापित विधि से दूर कर देता है, इसलिए आपको सीधे grecaptcha
चर को संभालने की आवश्यकता नहीं है।
एक दूसरे कारक का नामांकन
एक उपयोगकर्ता के लिए एक नया द्वितीयक कारक नामांकित करने के लिए:
उपयोगकर्ता को पुन: प्रमाणित करें।
उपयोगकर्ता से उनका फ़ोन नंबर दर्ज करने के लिए कहें।
reCAPTCHA सत्यापनकर्ता को प्रारंभ करें जैसा कि पिछले अनुभाग में दिखाया गया है। यदि RecaptchaVerifier का उदाहरण पहले से ही कॉन्फ़िगर किया गया है, तो इस चरण को छोड़ दें:
वेब मॉड्यूलर एपीआई
import { RecaptchaVerifier } from "firebase/auth"; const recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);
वेब नेमस्पेस्ड एपीआई
var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');
उपयोगकर्ता के लिए बहु-कारक सत्र प्राप्त करें:
वेब मॉड्यूलर एपीआई
import { multiFactor } from "firebase/auth"; multiFactor(user).getSession().then(function (multiFactorSession) { // ... });
वेब नेमस्पेस्ड एपीआई
user.multiFactor.getSession().then(function(multiFactorSession) { // ... })
उपयोगकर्ता के फ़ोन नंबर और बहु-कारक सत्र के साथ
PhoneInfoOptions
ऑब्जेक्ट प्रारंभ करें:वेब मॉड्यूलर एपीआई
// Specify the phone number and pass the MFA session. const phoneInfoOptions = { phoneNumber: phoneNumber, session: multiFactorSession };
वेब नेमस्पेस्ड एपीआई
// Specify the phone number and pass the MFA session. var phoneInfoOptions = { phoneNumber: phoneNumber, session: multiFactorSession };
उपयोगकर्ता के फ़ोन पर सत्यापन संदेश भेजें:
वेब मॉड्यूलर एपीआई
import { PhoneAuthProvider } from "firebase/auth"; const phoneAuthProvider = new PhoneAuthProvider(auth); phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier) .then(function (verificationId) { // verificationId will be needed to complete enrollment. });
वेब नेमस्पेस्ड एपीआई
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. })
जबकि आवश्यक नहीं है, यह उपयोगकर्ताओं को पहले से सूचित करने का सबसे अच्छा अभ्यास है कि उन्हें एक एसएमएस संदेश प्राप्त होगा और मानक दरें लागू होंगी।
यदि अनुरोध विफल रहता है, तो रीकैप्चा को रीसेट करें, फिर पिछले चरण को दोहराएं ताकि उपयोगकर्ता फिर से प्रयास कर सके। ध्यान दें कि
verifyPhoneNumber()
स्वचालित रूप से रीकैप्चा को रीसेट कर देगा जब यह एक त्रुटि फेंकता है, क्योंकि रीकैप्चा टोकन केवल एक बार उपयोग होते हैं।वेब मॉड्यूलर एपीआई
recaptchaVerifier.clear();
वेब नेमस्पेस्ड एपीआई
recaptchaVerifier.clear();
एसएमएस कोड भेजे जाने के बाद, उपयोगकर्ता से कोड सत्यापित करने के लिए कहें:
वेब मॉड्यूलर एपीआई
// Ask user for the verification code. Then: const cred = PhoneAuthProvider.credential(verificationId, verificationCode);
वेब नेमस्पेस्ड एपीआई
// Ask user for the verification code. Then: var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);
PhoneAuthCredential
के साथ एकMultiFactorAssertion
ऑब्जेक्ट को इनिशियलाइज़ करें:वेब मॉड्यूलर एपीआई
import { PhoneMultiFactorGenerator } from "firebase/auth"; const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);
वेब नेमस्पेस्ड एपीआई
var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
नामांकन पूरा करें। वैकल्पिक रूप से, आप दूसरे कारक के लिए एक प्रदर्शन नाम निर्दिष्ट कर सकते हैं। यह कई दूसरे कारकों वाले उपयोगकर्ताओं के लिए उपयोगी है, क्योंकि प्रमाणीकरण प्रवाह के दौरान फ़ोन नंबर छिपा हुआ है (उदाहरण के लिए, +1******1234)।
वेब मॉड्यूलर एपीआई
// Complete enrollment. This will update the underlying tokens // and trigger ID token change listener. multiFactor(user).enroll(multiFactorAssertion, "My personal phone number");
वेब नेमस्पेस्ड एपीआई
// Complete enrollment. This will update the underlying tokens // and trigger ID token change listener. user.multiFactor.enroll(multiFactorAssertion, 'My personal phone number');
नीचे दिया गया कोड दूसरे कारक को नामांकित करने का एक पूरा उदाहरण दिखाता है:
वेब मॉड्यूलर एपीआई
import {
multiFactor, PhoneAuthProvider, PhoneMultiFactorGenerator,
RecaptchaVerifier
} from "firebase/auth";
const recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);
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);
});
वेब नेमस्पेस्ड एपीआई
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);
});
बधाई हो! आपने उपयोगकर्ता के लिए दूसरा प्रमाणीकरण कारक सफलतापूर्वक पंजीकृत किया है।
दूसरे कारक के साथ उपयोगकर्ताओं को साइन इन करना
दो-कारक एसएमएस सत्यापन वाले उपयोगकर्ता में साइन इन करने के लिए:
उपयोगकर्ता को उनके पहले कारक के साथ साइन इन करें, फिर
auth/multi-factor-auth-required
त्रुटि पकड़ें। इस त्रुटि में एक रिज़ॉल्वर, नामांकित दूसरे कारकों पर संकेत और एक अंतर्निहित सत्र शामिल है जो उपयोगकर्ता को पहले कारक के साथ सफलतापूर्वक प्रमाणित करता है।उदाहरण के लिए, यदि उपयोगकर्ता का पहला कारक ईमेल और पासवर्ड था:
वेब मॉड्यूलर एपीआई
import { getAuth, 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. } });
वेब नेमस्पेस्ड एपीआई
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()
को कॉल करने के बाद त्रुटि को पकड़ें।यदि उपयोगकर्ता के पास एकाधिक माध्यमिक कारक नामांकित हैं, तो उनसे पूछें कि कौन सा उपयोग करना है:
वेब मॉड्यूलर एपीआई
// 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. }
वेब नेमस्पेस्ड एपीआई
// 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. }
reCAPTCHA सत्यापनकर्ता को प्रारंभ करें जैसा कि पिछले अनुभाग में दिखाया गया है। यदि RecaptchaVerifier का उदाहरण पहले से ही कॉन्फ़िगर किया गया है, तो इस चरण को छोड़ दें:
वेब मॉड्यूलर एपीआई
import { RecaptchaVerifier } from "firebase/auth"; recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);
वेब नेमस्पेस्ड एपीआई
var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');
उपयोगकर्ता के फ़ोन नंबर और बहु-कारक सत्र के साथ
PhoneInfoOptions
ऑब्जेक्ट प्रारंभ करें। ये मानauth/multi-factor-auth-required
त्रुटि को पारितresolver
ऑब्जेक्ट में निहित हैं:वेब मॉड्यूलर एपीआई
const phoneInfoOptions = { multiFactorHint: resolver.hints[selectedIndex], session: resolver.session };
वेब नेमस्पेस्ड एपीआई
var phoneInfoOptions = { multiFactorHint: resolver.hints[selectedIndex], session: resolver.session };
उपयोगकर्ता के फ़ोन पर सत्यापन संदेश भेजें:
वेब मॉड्यूलर एपीआई
// Send SMS verification code. const phoneAuthProvider = new PhoneAuthProvider(auth); phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier) .then(function (verificationId) { // verificationId will be needed for sign-in completion. });
वेब नेमस्पेस्ड एपीआई
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. })
यदि अनुरोध विफल रहता है, तो रीकैप्चा को रीसेट करें, फिर पिछले चरण को दोहराएं ताकि उपयोगकर्ता फिर से प्रयास कर सके:
वेब मॉड्यूलर एपीआई
recaptchaVerifier.clear();
वेब नेमस्पेस्ड एपीआई
recaptchaVerifier.clear();
एसएमएस कोड भेजे जाने के बाद, उपयोगकर्ता से कोड सत्यापित करने के लिए कहें:
वेब मॉड्यूलर एपीआई
const cred = PhoneAuthProvider.credential(verificationId, verificationCode);
वेब नेमस्पेस्ड एपीआई
// Ask user for the verification code. Then: var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);
PhoneAuthCredential
के साथ एकMultiFactorAssertion
ऑब्जेक्ट को इनिशियलाइज़ करें:वेब मॉड्यूलर एपीआई
const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);
वेब नेमस्पेस्ड एपीआई
var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
सेकेंडरी ऑथेंटिकेशन पूरा करने के लिए
resolver.resolveSignIn()
को कॉल करें। फिर आप मूल साइन-इन परिणाम तक पहुँच सकते हैं, जिसमें मानक प्रदाता-विशिष्ट डेटा और प्रमाणीकरण क्रेडेंशियल शामिल हैं:वेब मॉड्यूलर एपीआई
// 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. });
वेब नेमस्पेस्ड एपीआई
// 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. });
नीचे दिया गया कोड बहु-कारक उपयोगकर्ता में साइन इन करने का एक पूरा उदाहरण दिखाता है:
वेब मॉड्यूलर एपीआई
import {
getAuth,
getMultiFactorResolver,
PhoneAuthProvider,
PhoneMultiFactorGenerator,
RecaptchaVerifier,
signInWithEmailAndPassword
} from "firebase/auth";
const recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);
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.
}
});
वेब नेमस्पेस्ड एपीआई
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.
} ...
});
बधाई हो! आपने बहु-कारक प्रमाणीकरण का उपयोग करके सफलतापूर्वक एक उपयोगकर्ता में प्रवेश किया है।
आगे क्या होगा
- व्यवस्थापक SDK के साथ बहु-कारक उपयोगकर्ताओं को प्रोग्रामेटिक रूप से प्रबंधित करें ।