AngularFire2中的链接帐户

Question

我正在使用AngularFire2处理匿名帐户和谷歌帐户。如果用户使用Google帐户登录，我希望将他们的匿名帐户转换为他们的永久(Google)帐户，这样他们就可以继续无缝地使用该应用程序。

使用Firebase似乎很容易，但我看不到在AngularFire2中这样做的能力。

对于Firebase，您将获得新的auth提供程序的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，因为由应用程序创建的Firebase AngularFire2可以用于注入。

您可以使用注入的应用程序访问auth() (或storage())实例中没有被AngularFire2公开的任何方法。

对于一个示例，您可以将其插入到一个应用程序组件中，如下所示：

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命名空间中(而不是app实例)。此外，由于AngularFire2在FirebaseAuthState的(名称混乱的) auth属性中提供了当前用户，因此您不需要注入应用实例就可以对Google执行您想要做的事情。您只需要firebase导入：

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

Answer 2

AngularFire2 v4中的完整示例。它将一个匿名用户升级到Google提供者，保持相同的auth。

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


}

Answer 3

这是一个有用的例子；

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