사용자를 인증하고 세부 정보를 저장하는 방법

Question

나는 angularfire2 문서를 읽으려고 시도했으며 여기까지 왔습니다. 내 인증 서비스 호출은 anglefire.auth.login입니다. 이 함수를 구독하고 반환 된 userinfo를 데이터베이스에 저장하려고합니다.

Error: Typescript found the following errors: /Users/macbook/dev/app/kichenclub/tmp/broccoli_type_script_compiler-input_base_path-nMnfGgj9.tmp/0/src/app/auth.service.ts (12, 25): Property 'displayName' does not exist on type 'FirebaseAuthState'.

모든 '나 displayName'에 대한 같은 :

타이프 라이터 컴파일러는 오류를 반환합니다.

나는 올바른 방향으로 가고 있습니까? 이것을 어떻게 해결할 수 있을까요?

authentication.service.ts : 어떤 추가 정보가 필요한 경우

import { Injectable } from '@angular/core'; 
import { AngularFire, AuthProviders, AuthMethods } from 'angularfire2'; 

@Injectable() 
export class AuthService { 
    private userModel= this.af.database.object('/users'); 
    constructor(private af: AngularFire) { 
    this.af.auth.subscribe((auth) => { 
     console.log(auth); 
     this.userModel.set({ 
     uid: auth.uid, 
     firstName: auth.displayName.split(0, auth.displayName.lastIndexOf(' ')), 
     lastName: auth.displayName.split(auth.displayName.lastIndexOf(' '), auth.displayName.length), 
     displayPic: auth.photoURL, 
     provider:auth.provider 
     }); 
    }); 
    } 

    public loginFacebook(): void { 
    this.af.auth.login({ 
     provider: AuthProviders.Facebook, 
     method: AuthMethods.Popup 
    }) 
    } 
} 

이, 알려주세요.

마지막으로, 들러 주셔서 감사합니다. :)

Answer 1

나는 GitHub의 angularfire2 소스 코드를 살펴보고 FirebaseAuthState 인터페이스를 살펴 보았습니다. here을 찾을 수 있습니다. TypeScript 인터페이스 자체에 'displayName'이라는 속성이 없다는 것을 알 수 있습니다. 그러나 나는 당신이 auth.facebook 속성에 대해 자세히 살펴 할 것이라고 생각 데이터를 보유하는 표시 거기에 nullable 형식은 당신이

export interface FirebaseAuthState { 
    uid: string; 
    provider: AuthProviders; 
    auth: firebase.User; 
    expires?: number; 
    github?: CommonOAuthCredential; 
    google?: GoogleCredential; 
    twitter?: TwitterCredential; 
    facebook?: CommonOAuthCredential;//<---based on your code I think this is what you're looking for. 
    anonymous?: boolean; 
} 

찾고있는 것을 보여 않습니다. 세부 정보를 더 자세히 보려면 ​​구독 메소드의 코드를 주석 처리하고 콘솔에 객체를 쓰고 브라우저 개발자 도구를 사용하여 브라우저에서 살펴보십시오. 예를 들면 다음과 같습니다.

this.af.auth.subscribe((auth) => { 
    console.log(auth); 
    //this.userModel.set({ 
    //uid: auth.uid, 
    //firstName: auth.displayName.split(0, auth.displayName.lastIndexOf(' ')), 
    //lastName: auth.displayName.split(auth.displayName.lastIndexOf(' '), auth.displayName.length), 
    //displayPic: auth.photoURL, 
    //provider:auth.provider 
    //}); 
}); 

이렇게하면 auth.facebook의 데이터를 자세히 볼 수 있습니다.