Firebase Auth存储用户的名字和姓氏

时间:2019-01-10 16:17:42

标签: angular firebase firebase-authentication

尊敬的Stackoverflow社区,

我们正在使用Firebase Auth进行身份验证。为此,我们提供使用Google和Facebook的社交登录以及使用电子邮件和密码登录。以下代码显示了想要稍后使用电子邮件和密码登录的用户的注册页面。

import { Router } from '@angular/router';
import { Component, OnInit } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';
import { auth } from 'firebase/app';


@Component({
  selector: 'app-register',
  templateUrl: './register.component.html',
  styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {
  public emailAddress="";
  public firstName="";
  public lastName="";
  public password="";

  constructor(public afAuth: AngularFireAuth, private router: Router) {
  }

  ngOnInit() {
  }

  reset() {
    this.emailAddress=""
    this.password=""
    this.firstName=""
    this.lastName=""
  }

  register() {
    let emailAddress = this.emailAddress
    let password = this.password
    let firstName = this.firstName
    let lastName = this.lastName
    this.reset()
    console.log(emailAddress)
    console.log(password)
    auth().createUserWithEmailAndPassword(emailAddress, password).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      console.log(errorCode)
      var errorMessage = error.message;
      console.log(errorMessage)
      // ...
    });
  }
}

电子邮件,密码,名字,姓氏的数据来自一个输入字段,该输入字段通过与组件的数据绑定交换数据。

<input type="email" [(ngModel)]="emailAddress" required>

当我尝试让用户使用显示名称时,该显示名称仅在用户使用社交提供程序登录时才有效。这很明显,因为他在使用电子邮件和密码注册时没有设置它。现在我想问你,是否有人知道如何在firebase中存储firstName和lastName以便可以显示user.displayName。

<div *ngIf="afAuth.user | async as user; else notAuth">
 Hello {{ user.displayName }}
</div>

2 个答案:

答案 0 :(得分:0)

如果您使用密码创建用户(即通过调用firebase.auth().createUserWithEmailAndPassword(email, password)),则可以等待诺言解析更新显示名称。这可以通过update_profile对象的user方法来完成。这是文档的链接:

https://firebase.google.com/docs/auth/web/manage-users#update_a_users_profile

更新后,您可以以与其他身份验证提供程序(即Facebook或Google)相同的方式访问displayName

答案 1 :(得分:0)

联合登录的操作与电子邮件/ pwd登录的操作不同,但是无论如何,在firebase.auth()子系统(Firebase控制台中的“身份验证”按钮/部分)中创建用户与将数据存储在数据存储,例如实时数据库或Firestore。所以,这是2个独立的事件/事情。

firstNamelastName只是必须存储在数据存储区中的记录。

最佳做法是使用uid中的用户firebase.auth().currentUser.uid作为存储在数据存储区"users"集合中的用户文档的文档ID。

.onAuthStateChanged是适当的客户端观察者,可用于监听以捕获已登录用户的uid。观察者不是同步的-因此,必须从.onAuthStateChanged观察者中触发在用户文档中创建/存储其他用户信息的代码(在激发之后,您将有一个填充的user对象。