Kezdje el a Firebase-hitelesítést a webhelyeken

A Firebase-hitelesítéssel lehetővé teheti a felhasználók számára, hogy egy vagy több bejelentkezési módszerrel jelentkezzenek be az alkalmazásába, beleértve az e-mail cím és jelszó alapú bejelentkezést, valamint az olyan föderált identitásszolgáltatókat, mint a Google Sign-in és a Facebook Login. Ez az útmutató a Firebase hitelesítéssel való kezdéshez mutatja be, hogyan adhat hozzá e-mail cím és jelszó bejelentkezést az alkalmazásához.

Az alkalmazás csatlakoztatása a Firebase-hez

Telepítse a Firebase SDK-t. Ügyeljen arra, hogy a konfigurációs kódot a leírtak szerint illessze be a weboldalába.

(Nem kötelező) Prototípus készítése és tesztelés a Firebase Local Emulator Suite segítségével

Mielőtt arról beszélnénk, hogyan hitelesíti az alkalmazás a felhasználókat, mutassunk be egy eszközkészletet, amelyet a hitelesítési funkciók prototípus készítéséhez és teszteléséhez használhat: Firebase Local Emulator Suite. Ha a hitelesítési technikák és szolgáltatók között dönt, különböző adatmodelleket próbál ki nyilvános és privát adatokkal a hitelesítés és a Firebase biztonsági szabályok használatával, vagy a bejelentkezési felhasználói felület terveinek prototipizálását végzi, nagyszerű ötlet lehet, ha élő szolgáltatások telepítése nélkül tud lokálisan dolgozni.

A hitelesítési emulátor a Local Emulator Suite része, amely lehetővé teszi az alkalmazás számára, hogy kölcsönhatásba lépjen az emulált adatbázis tartalmával és konfigurációjával, valamint opcionálisan az emulált projekt erőforrásaival (funkciók, más adatbázisok és biztonsági szabályok). Vegye figyelembe, hogy a Local Emulator Suite még nem támogatja az emulált tárolást.

A hitelesítési emulátor használata mindössze néhány lépésből áll:

  1. Egy kódsor hozzáadása az alkalmazás tesztkonfigurációjához az emulátorhoz való csatlakozáshoz.
  2. A helyi projektkönyvtár gyökeréből a firebase emulators:start futtatása.
  3. A Local Emulator Suite UI használata interaktív prototípusok készítéséhez, vagy azAuthentication emulator REST API használata nem interaktív teszteléshez.

Egy részletes útmutató elérhető a Connect your app to the Authentication emulator. további információkért lásd a Local Emulator Suite bevezetőjét.

Most folytassuk a felhasználók hitelesítésével.

Új felhasználók regisztrálása

Készítsünk egy űrlapot, amely lehetővé teszi az új felhasználók számára, hogy regisztráljanak az alkalmazásba az e-mail címük és egy jelszó segítségével. Amikor a felhasználó kitölti az űrlapot, ellenőrizze a felhasználó által megadott e-mail címet és jelszót, majd adja át azokat acreateUserWithEmailAndPassword metódusnak:

Meglévő felhasználók bejelentkezése

Készítsen egy űrlapot, amely lehetővé teszi a meglévő felhasználók számára, hogy bejelentkezzenek az e-mail címük és jelszavuk használatával. Amikor egy felhasználó kitölti az űrlapot, hívja meg asignInWithEmailAndPassword metódust:

Hitelesítési állapotmegfigyelő beállítása és felhasználói adatok lekérése

Az alkalmazás minden olyan oldalához, amelynek információra van szüksége a bejelentkezett felhasználóról,csatoljon egy megfigyelőt a globális hitelesítési objektumhoz. Ez a megfigyelő minden alkalommal meghívódik, amikor a felhasználó bejelentkezési állapota megváltozik.

A megfigyelőt a onAuthStateChanged módszerrel csatolja. Amikor egy felhasználó sikeresen bejelentkezik, a megfigyelőben információkat kaphat a felhasználóról.

Tudja meg, hogyan adhat támogatást más azonosítószolgáltatók és névtelen vendégfiókok számára:

  • Google bejelentkezés
  • Facebook bejelentkezés
  • Twitter bejelentkezés
  • GitHub bejelentkezés
  • Anonim bejelentkezés

.

Leave a Reply