### 前提・実現したいこと新規ユーザー登録をした**直後に**、ユーザーネームを画面に表示したい。 ### 発生している問題サインインで登録した直後にfirebaseのデータベース（Firestore）を見ると・usersコレクションの中にuidがあり・Authenticationにアカウントが登録されているサインインで登録した直後ではemailとuidしか存在していなくて、**displayNameはnullです。** **しかし一度リロードすると、サインイン時に入力した名前がdisplayNameが登録されます。** ### 該当のソースコード **auth.service.ts** ```typescript import { Injectable } from '@angular/core'; import { Router } from '@angular/router'; import { AngularFireAuth } from '@angular/fire/auth'; import { Observable } from 'rxjs'; import { AngularFirestore, AngularFirestoreDocument } from '@angular/fire/firestore'; import { switchMap } from 'rxjs/operators'; export interface User { uid: string; email: string; displayName?: string; myCustomData?: string; photoURL?: string; } @Injectable({ providedIn: 'root' }) export class AuthService { user$: Observable; constructor( private router: Router, private afs: AngularFirestore, private afAuth: AngularFireAuth ) { this.user$ = this.afAuth.authState.pipe( switchMap(user => { if (user) { this.updateUserData(user); console.log('auth.service ' + user.displayName); return this.afs.doc(`users/${user.uid}`).valueChanges(); } else { this.router.navigateByUrl('/auth'); } }) ); } async login(email: string, password: string) { await this.afAuth.auth.signInWithEmailAndPassword(email, password) .then((user) => { console.log(user); this.router.navigateByUrl('/'); }) .catch((error) => { console.log(error); this.router.navigateByUrl('/auth'); }); } async logout() { await this.afAuth.auth.signOut(); this.router.navigateByUrl('/auth'); } updateUserData(user) { // ログイン時にユーザーデータをfirestoreに設定 const userRef: AngularFirestoreDocument = this.afs.doc(`users/${user.uid}`); const data = { uid: user.uid, email: user.email, displayName: user.displayName, photoURL: user.photoURL }; console.log(data); return userRef.set(data, { merge: true }); } } ``` signup.page.ts ```typescript import { Router } from '@angular/router'; import { AuthService } from './../auth/auth.service'; import { Component, OnInit } from '@angular/core'; import { AngularFireAuth } from '@angular/fire/auth'; import { ToastController } from '@ionic/angular'; @Component({ selector: 'app-signup', templateUrl: './signup.page.html', styleUrls: ['./signup.page.scss'], }) export class SignupPage implements OnInit { signup: { email: string; password: string; name: string; } = { email: '', password: '', name: '', }; constructor( private router: Router, private afAuth: AngularFireAuth, private toastCtrl: ToastController, private authService: AuthService ) { } ngOnInit() { } signUp() { this.afAuth.auth .createUserWithEmailAndPassword(this.signup.email, this.signup.password) .then((created) => { const newUser = created.user; newUser.updateProfile({ displayName: this.signup.name, photoURL: '' }) .catch((error) => { console.log('signUpでエラー: ' + error); this.router.navigateByUrl('/signup'); }) .then(async () => { const toast = await this.toastCtrl.create({ // 入力した名前が表示される message: `${created.user.displayName}さんを登録しました`, duration: 3000 }); await toast.present(); this.authService.updateUserData(newUser); }) .catch(async error => { const toast = await this.toastCtrl.create({ message: error.toString(), duration: 3000 }); await toast.present(); }); this.router.navigateByUrl('/'); }); } goLogin() { this.router.navigateByUrl('/auth'); } } ``` home.page.ts ```html

リスト

ログアウト

Howdy, {{ user.displayName }}

UID: {{ user.uid }}

``` ##エラー **「ユーザー登録でdisplayNameがnullになる」とは関係ないかもですが、、、。** ログアウトした時に毎回発生します。コンソールにエラーは出るが、今の所特に問題なく動く。 ``` Uncaught TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable. at subscribeTo (subscribeTo.js:27) at subscribeToResult (subscribeToResult.js:11) at SwitchMapSubscriber._innerSub (switchMap.js:46) at SwitchMapSubscriber._next (switchMap.js:36) at SwitchMapSubscriber.next (Subscriber.js:49) at angularfire2.js:44 at ZoneDelegate.invoke (zone-evergreen.js:359) at Object.onInvoke (core.js:34201) at ZoneDelegate.invoke (zone-evergreen.js:358) at Zone.run (zone-evergreen.js:124) ``` ### 補足情報（FW/ツールのバージョンなど） ionic info ``` Ionic: Ionic CLI : 5.2.8 (/usr/local/lib/node_modules/ionic) Ionic Framework : @ionic/angular 4.8.0 @angular-devkit/build-angular : 0.801.3 @angular-devkit/schematics : 8.1.3 @angular/cli : 8.1.3 @ionic/angular-toolkit : 2.0.0 Utility: cordova-res : 0.6.0 native-run : 0.2.8 System: NodeJS : v10.15.1 (/usr/local/bin/node) npm : 6.4.1 OS : macOS Mojave ``` ##参考にしたサイト [https://fireship.io/lessons/angularfire-google-oauth/](https://fireship.io/lessons/angularfire-google-oauth/)

	@@ -1 +1 @@
1	- ionic + Firebaseの~~ユーザー~~登録でdisplayNameがnullになる
1	+ ionic + Firebaseのアカウント登録でdisplayNameがnullになる

質問編集履歴