在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) 
    } 


}