在AngularFire2中鏈接帳戶

Question

我使用AngularFire2處理匿名和Google帳戶。如果用戶使用Google帳戶登錄，我想將他們的匿名帳戶轉換爲他們的永久（Google）帳戶，以便他們可以繼續無縫使用該應用。

使用Firebase API似乎很容易，但我沒有看到在AngularFire2中做到這一點的能力。

對於火力地堡，你得到的AuthCredential爲新的身份驗證提供程序，然後使用鏈接方法對賬戶轉換：

var credential = firebase.auth.GoogleAuthProvider.credential(
    googleUser.getAuthResponse().id_token); 

auth.currentUser.link(credential).then(function(user) { 
    console.log("Anonymous account successfully upgraded", user); 
}, function(error) { 
    console.log("Error upgrading anonymous account", error); 
}); 

在AngularFire2這可能嗎？

Answer 1

應該沒有理由不能使用底層的Firebase API，因爲由AngularFire2創建的Firebase App可用於注入。

您可以使用注入的應用程序訪問未由AngularFire2公開的auth()（或storage()）實例的任何方法。

舉一個例子的目的，你可以把它注射到一個應用程序組件是這樣的：

import { Component, Inject } from "@angular/core"; 
import { AngularFire, FirebaseApp } from "angularfire2"; 
import * as firebase from "firebase"; 

@Component({ 
    selector: "app", 
    template: ... 
}) 
export class AppComponent { 

    constructor(
    // Inject AngularFire2: 
    private angularFire: AngularFire, 
    // Inject the Firebase App instance: 
    @Inject(FirebaseApp) private firebaseApp: firebase.app.App 
) { 

    // Perform some sort of login. 

    ... 

    angularFire.auth.subscribe((state) => { 

     // AngularFire2's auth observable will emit when the authentication 
     // state changes and if the state is non-null, there will be a 
     // current user. At this point, you should be able to do with the 
     // injected app what it was you were doing with the SDK. 

     if (state) { 

     var credential = firebase.auth 
      .GoogleAuthProvider 
      .credential(googleUser.getAuthResponse().id_token); 

     firebaseApp.auth() 
      .currentUser 
      .link(credential) 
      .then((user) => { 
      console.log("Anonymous account successfully upgraded", user); 
      }) 
      .catch((error) => { 
      console.log("Error upgrading anonymous account", error); 
      }); 
     } 
    }); 
    } 
} 

您不必使用auth觀察的;您還可以使用AngularFire2的auth.login方法返回的承諾將代碼放入承諾鏈中。

正如以下評論所述，GoogleAuthProvider類位於firebase.app命名空間（不是應用程序實例）中。另外，由於當前用戶可以通過FirebaseAuthState（易混淆命名）的auth屬性中的AngularFire2提供，因此您無需注入應用實例即可執行您想要對Google提供商執行的操作。您只需要輸入firebase：

this.angularFire.auth.login({ 
    email: "some@address.com", 
    password: "password", 
}) 
.then((authState: FirebaseAuthState) => { 
    authState.auth.linkWithRedirect(new firebase.auth.GoogleAuthProvider()); 
}); 

Answer 2

這裏是一個工作示例;

import * as firebase from 'firebase': 


upgradeAnonymous() { 

    let credential = new firebase.auth.GoogleAuthProvider(); 

    firebase.auth().currentUser.linkWithPopup(credential).then(function(user) { 
     console.log("Anonymous account successfully upgraded", user); 
     }, function(error) { 
     console.log("Error upgrading anonymous account", error); 
     }) 
} 

Answer 3

AngularFire2 v4中的完整示例。它會將匿名用戶升級到Google提供商，並保留相同的身份驗證UID。

import { Component, OnInit } from '@angular/core'; 
import { AngularFireAuth } from 'angularfire2/auth'; 
import * as firebase from 'firebase/app'; 
import { Observable } from 'rxjs/Observable'; 

@Component({ 
    selector: 'app-user', 
    templateUrl: './user.component.html', 
    styleUrls: ['./user.component.scss'] 
}) 
export class UserComponent implements OnInit { 

    user: Observable<firebase.User>; 

    constructor(private afAuth: AngularFireAuth) { } 

    ngOnInit() { 
    this.user = this.afAuth.authState; 
    } 

    anonymousLogin() { 
    return this.afAuth.auth.signInAnonymously() 
    } 

    anonymousUpgrade() { 
    const provider = new firebase.auth.GoogleAuthProvider() 
    firebase.auth().currentUser.linkWithPopup(provider) 
    } 


}