Kullanıcıların, e-posta adresi ve şifreyle oturum açma dahil olmak üzere bir veya daha fazla oturum açma yöntemini ve Google Oturum Açma ve Facebook Oturum Açma gibi birleştirilmiş kimlik sağlayıcıları kullanarak uygulamanızda oturum açmasına izin vermek için Firebase Kimlik Doğrulaması'nı kullanabilirsiniz. Bu eğitim, uygulamanıza nasıl e-posta adresi ve oturum açma parolası ekleyeceğinizi göstererek Firebase Authentication'ı kullanmaya başlamanızı sağlar.
Kimlik Doğrulama SDK'sını ekleyin ve başlatın
Henüz yapmadıysanız, Firebase JS SDK'yı kurun ve Firebase'i başlatın .
Firebase Authentication JS SDK'sını ekleyin ve Firebase Authentication'ı başlatın:
Web modüler API
import { initializeApp } from "firebase/app"; import { getAuth } from "firebase/auth"; // TODO: Replace the following with your app's Firebase project configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize Firebase const app = initializeApp(firebaseConfig); // Initialize Firebase Authentication and get a reference to the service const auth = getAuth(app);
Web ad alanlı API
import firebase from "firebase/compat/app"; import "firebase/compat/auth"; // TODO: Replace the following with your app's Firebase project configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize Firebase firebase.initializeApp(firebaseConfig); // Initialize Firebase Authentication and get a reference to the service const auth = firebase.auth();
(İsteğe bağlı) Firebase Local Emulator Suite ile prototip oluşturun ve test edin
Uygulamanızın kullanıcıların kimliğini nasıl doğruladığı hakkında konuşmadan önce, Kimlik Doğrulama işlevinin prototipini oluşturmak ve test etmek için kullanabileceğiniz bir dizi aracı tanıtalım: Firebase Local Emulator Suite. Kimlik doğrulama teknikleri ve sağlayıcılar arasında karar veriyorsanız, Kimlik Doğrulama ve Firebase Güvenlik Kurallarını kullanarak genel ve özel verilerle farklı veri modelleri deniyorsanız veya oturum açma kullanıcı arabirimi tasarımlarının prototipini oluşturuyorsanız, canlı hizmetleri dağıtmadan yerel olarak çalışabilmek harika bir fikir olabilir. .
Kimlik Doğrulama öykünücüsü, uygulamanızın öykünülmüş veritabanı içeriği ve yapılandırmasının yanı sıra isteğe bağlı olarak öykünmüş proje kaynaklarınızla (işlevler, diğer veritabanları ve güvenlik kuralları) etkileşim kurmasını sağlayan Yerel Öykünücü Paketinin bir parçasıdır.
Kimlik Doğrulama öykünücüsünü kullanmak yalnızca birkaç adımı içerir:
- Öykünücüye bağlanmak için uygulamanızın test yapılandırmasına bir kod satırı ekleme.
- Yerel proje dizininizin kökünden, çalıştırılan
firebase emulators:start
. - Etkileşimli prototip oluşturma için Local Emulator Suite Kullanıcı Arabirimini veya etkileşimli olmayan testler için Kimlik Doğrulama öykünücüsü REST API'sini kullanma.
Uygulamanızı Kimlik Doğrulama öykünücüsüne bağlama adresinde ayrıntılı bir kılavuz mevcuttur. Daha fazla bilgi için Local Emulator Suite tanıtımına bakın.
Şimdi kullanıcıların kimliğinin nasıl doğrulanacağına devam edelim.
yeni kullanıcılar kaydet
Yeni kullanıcıların e-posta adreslerini ve parolalarını kullanarak uygulamanıza kaydolmasına olanak tanıyan bir form oluşturun. Bir kullanıcı formu doldurduğunda, kullanıcı tarafından sağlanan e-posta adresini ve parolayı doğrulayın, ardından bunları createUserWithEmailAndPassword
yöntemine iletin:
Web modular API
import { getAuth, createUserWithEmailAndPassword } from "firebase/auth"; const auth = getAuth(); createUserWithEmailAndPassword(auth, email, password) .then((userCredential) => { // Signed up const user = userCredential.user; // ... }) .catch((error) => { const errorCode = error.code; const errorMessage = error.message; // .. });
Web namespaced API
firebase.auth().createUserWithEmailAndPassword(email, password) .then((userCredential) => { // Signed in var user = userCredential.user; // ... }) .catch((error) => { var errorCode = error.code; var errorMessage = error.message; // .. });
Mevcut kullanıcılarda oturum açın
Mevcut kullanıcıların e-posta adreslerini ve şifrelerini kullanarak oturum açmalarına izin veren bir form oluşturun. Bir kullanıcı formu tamamladığında, signInWithEmailAndPassword
yöntemini çağırın:
Web modular API
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; });
Web namespaced API
firebase.auth().signInWithEmailAndPassword(email, password) .then((userCredential) => { // Signed in var user = userCredential.user; // ... }) .catch((error) => { var errorCode = error.code; var errorMessage = error.message; });
Bir kimlik doğrulama durumu gözlemcisi ayarlayın ve kullanıcı verilerini alın
Uygulamanızın oturum açmış kullanıcı hakkında bilgi gerektiren sayfalarının her biri için, genel kimlik doğrulama nesnesine bir gözlemci ekleyin. Bu gözlemci, kullanıcının oturum açma durumu değiştiğinde çağrılır.
onAuthStateChanged
yöntemini kullanarak gözlemciyi ekleyin. Bir kullanıcı başarılı bir şekilde oturum açtığında, gözlemcide kullanıcı hakkında bilgi alabilirsiniz.
Web modular API
import { getAuth, onAuthStateChanged } from "firebase/auth"; const auth = getAuth(); onAuthStateChanged(auth, (user) => { if (user) { // User is signed in, see docs for a list of available properties // https://firebase.google.com/docs/reference/js/auth.user const uid = user.uid; // ... } else { // User is signed out // ... } });
Web namespaced API
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/v8/firebase.User var uid = user.uid; // ... } else { // User is signed out // ... } });
Sonraki adımlar
Diğer kimlik sağlayıcılar ve anonim konuk hesapları için nasıl destek ekleyeceğinizi öğrenin: