Check out what’s new from Firebase@ Google I/O 2021, and join our alpha program for early access to the new Remote Config personalization feature. Learn more

वेबसाइटों पर फायरबेस प्रमाणीकरण के साथ आरंभ करें

आप उपयोगकर्ताओं को ईमेल पते और पासवर्ड साइन-इन और Google साइन-इन और Facebook लॉगिन जैसे फ़ेडरेटेड पहचान प्रदाताओं सहित एक या अधिक साइन-इन विधियों का उपयोग करके अपने ऐप में साइन इन करने की अनुमति देने के लिए Firebase प्रमाणीकरण का उपयोग कर सकते हैं। यह ट्यूटोरियल आपको अपने ऐप में ईमेल पता और पासवर्ड साइन-इन जोड़ने का तरीका दिखाते हुए फायरबेस प्रमाणीकरण के साथ आरंभ करता है।

अपने ऐप्लिकेशन को Firebase से कनेक्ट करें

फायरबेस एसडीके स्थापित करें । कॉन्फ़िगरेशन कोड को अपने वेब पेज में बताए अनुसार पेस्ट करना सुनिश्चित करें।

(वैकल्पिक) फायरबेस स्थानीय एमुलेटर सूट के साथ प्रोटोटाइप और परीक्षण

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

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

प्रमाणीकरण एमुलेटर का उपयोग करने में कुछ ही चरण शामिल हैं:

  1. एमुलेटर से कनेक्ट करने के लिए अपने ऐप के टेस्ट कॉन्फिगर में कोड की एक लाइन जोड़ना।
  2. अपनी स्थानीय परियोजना निर्देशिका की जड़ से, firebase emulators:start चला रहे हैं firebase emulators:start
  3. इंटरैक्टिव प्रोटोटाइप के लिए स्थानीय एम्यूलेटर सूट यूआई का उपयोग करना, या गैर-संवादात्मक परीक्षण के लिए प्रमाणीकरण एमुलेटर आरईएसटी एपीआई का उपयोग करना।

अपने ऐप को ऑथेंटिकेशन एमुलेटर से कनेक्ट करें पर एक विस्तृत गाइड उपलब्ध है । अधिक जानकारी के लिए, स्थानीय एमुलेटर सूट परिचय देखें

अब चलिए जारी रखते हैं कि उपयोगकर्ताओं को कैसे प्रमाणित किया जाए।

नए उपयोगकर्ता साइन अप करें

एक फ़ॉर्म बनाएं जो नए उपयोगकर्ताओं को उनके ईमेल पते और पासवर्ड का उपयोग करके आपके ऐप के साथ पंजीकरण करने की अनुमति देता है। जब कोई उपयोगकर्ता फ़ॉर्म को पूरा करता है, तो उपयोगकर्ता द्वारा प्रदान किए गए ईमेल पते और पासवर्ड को मान्य करें, फिर उन्हें createUserWithEmailAndPassword विधि में पास करें:

वेब v8

firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in 
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });

वेब v9

०९३५०११९१०

मौजूदा उपयोगकर्ताओं में साइन इन करें

एक ऐसा फॉर्म बनाएं जो मौजूदा उपयोगकर्ताओं को अपने ईमेल पते और पासवर्ड का उपयोग करके साइन इन करने की अनुमति देता है। जब कोई उपयोगकर्ता फ़ॉर्म को पूरा करता है, तो signInWithEmailAndPassword विधि को कॉल करें:

वेब v8

firebase.auth().signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
  });

वेब v9

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

const auth = getAuth();
signInWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    // Signed in 
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
  });

प्रमाणीकरण स्थिति पर्यवेक्षक सेट करें और उपयोगकर्ता डेटा प्राप्त करें

आपके ऐप के ऐसे प्रत्येक पृष्ठ के लिए जिन्हें साइन-इन किए गए उपयोगकर्ता के बारे में जानकारी की आवश्यकता है, एक पर्यवेक्षक को वैश्विक प्रमाणीकरण ऑब्जेक्ट में संलग्न करें। जब भी उपयोगकर्ता की साइन-इन स्थिति बदलती है, तो इस पर्यवेक्षक को कॉल किया जाता है।

onAuthStateChanged विधि का उपयोग करके पर्यवेक्षक को संलग्न करें। जब कोई उपयोगकर्ता सफलतापूर्वक साइन इन करता है, तो आप ऑब्जर्वर में उपयोगकर्ता के बारे में जानकारी प्राप्त कर सकते हैं।

वेब v8

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    var uid = user.uid;
    // ...
  } else {
    // User is signed out
    // ...
  }
});

वेब v9

०३५६५१०४२०

अगला कदम

अन्य पहचान प्रदाताओं और अनाम अतिथि खातों के लिए समर्थन जोड़ने का तरीका जानें: