Heim >Web-Frontend >js-Tutorial >Firebase Auth VS Manual Auth: Eine Entwicklerreise
Die Entwicklung einer neuen E-Commerce-Plattform, die Stockx- und eBay-Funktionen mischt, präsentierte eine steile Lernkurve. Mein erstes großes Projekt, das ich zunächst auf eine vollständig kundenspezifische Lösung zielte, einschließlich der Authentifizierung. Diese Entscheidung hat jedoch die wesentlichen Vorteile von Firebase Auth gegenüber der manuellen Authentifizierung hervorgehoben.
Manuelle Authentifizierung: Der anfängliche Versuch
Mein erster Ansatz umfasste ein manuelles Authentifizierungssystem neben Firebase für die Datenspeicherung. Der Prozess war:
Diese erste Implementierung, die unten gezeigt wurde, schien einfach:
<code class="language-javascript">const submitFormData = async (path, data) => { // Store JWT token localStorage.setItem("token", responseData.data.token); console.log("Redirecting to home page"); location.replace("/"); }; subBtn.addEventListener("click", () => { // Form validation if (!tac.checked) { showAlert("you must agree to our terms and conditions"); } else { loader.style.display = "block"; submitFormData("/signup", { name: name.value, email: email.value, password: password.value, number: number.value, tac: tac.checked, notification: notification.checked, seller: false }); } });</code>
Die Straßensperre
Das Problem trat beim Abholen von Benutzerdaten von Firebase auf. Das Benutzerobjekt gab konsequent null
zurück. Stunden des Debuggens zeigten die Einschränkungen meines manuellen Ansatzes. Firebase Auth war eine weitaus elegantere Lösung.
Die Firebase -Auth -Lösung: Ein optimierter Ansatz
Umschaltung in Firebase Autha -Autha -Authu -Verfahren den Prozess dramatisch vereinfacht. Die überarbeitete Implementierung:
<code class="language-javascript">const auth = getAuth(); createUserWithEmailAndPassword(auth, email.value, password.value) .then((userCredential) => { const user = userCredential.user; loader.style.display = "block"; return submitFormData("/signup", { name: name.value, email: email.value, password: password.value, number: number.value, tac: tac.checked, notification: notification.checked, seller: false }); }) .catch((error) => { showAlert(error.message); });</code>
<code class="language-javascript">signInWithEmailAndPassword(auth, email.value, password.value) .then((userCredential) => { const user = userCredential.user; loader.style.display = "block"; return submitFormData("/login", { email: email.value, password: password.value }); }) .catch((error) => { showAlert(error.message); });</code>
Schlüsselverbesserungen:
getAuth()
verarbeitet komplexe Sicherheitskonfigurationen. createUserWithEmailAndPassword()
und signInWithEmailAndPassword()
E -Mail -Validierung, Kennwortsicherheit, Benutzererstellung und Sitzungsverwaltung automatisch verwalten. Lektionen gelernt
Authentifizierung von Grund auf neu erstellen ist eine wertvolle Lernerfahrung, aber Firebase Auth bietet eine sichere, gut getestete und zeitsparende Alternative. Die nahtlose Integration in Firestore und integrierte Sicherheitsfunktionen sind für Produktionsanwendungen von unschätzbarem Wert. Für produktionsbereite Software wird die Nutzung etablierter Lösungen wie Firebase Auth sehr empfohlen.
Das obige ist der detaillierte Inhalt vonFirebase Auth VS Manual Auth: Eine Entwicklerreise. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!