Question

我正在尝试使用Facebook原生和Angularfire2（2.0.0-beta.2）登录我的Ionic 2应用程序，但即使我成功获取访问令牌，无论我如何尝试将其传递给angularfire的auth.login函数仍会抛出无效的凭据错误。

这是我的配置：

firebaseAuthConfig({
   provider: AuthProviders.Facebook,
   method: AuthMethods.OAuthToken,
   remember: "default",
   scope: ["email"]
})

这是我的登录功能：

login() {
Facebook.login(["public_profile", "email", "user_friends"])
  .then((success) => {
    console.log("Facebook success: " + JSON.stringify(success));
    this.af.auth.login(success.authResponse.accessToken, { provider: AuthProviders.Facebook })
      .then((success) => {
        console.log("Firebase success: " + JSON.stringify(success));
      })
      .catch((error) => {
        console.log("Firebase failure: " + JSON.stringify(error));
      });
  })
  .catch((error) => {
    console.log("Facebook failure: " + JSON.stringify(error));
  });
}

这是我在console.log中遇到的错误：

Facebook failure: {"code":"auth/argument-error","message":"signInWithCredential failed: First argument \"credential\" must be a valid credential."}

有趣的是，它是在Facebook级别被捕获而不是我为auth.login设置的捕获。我试过以几种不同的方式传递它，包括作为一个对象{ token: success.authResponse.accessToken }，我现在不知所措。谁能帮我看看我做错了什么？谢谢！

此外，我不认为这是相关的，但以防万一它我也收到一个“操作已超时错误”，它没有被捕获但似乎被我的this.af.auth.subscribe抛出呼叫。该应用程序保持正常运行，但也许这可能是导致登录失败的原因？

Answer 1

import {Component} from '@angular/core';
import {Platform, ionicBootstrap} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {HomePage} from './pages/home/home';
import {Facebook} from 'ionic-native';

import {
  FIREBASE_PROVIDERS, defaultFirebase,
  AngularFire, firebaseAuthConfig, AuthProviders,
  AuthMethods
} from 'angularfire2';


declare let firebase: any; // <== THERE IS AN ERROR IN THE .d.ts file

@Component({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
  providers: [
    FIREBASE_PROVIDERS,
    // Initialize Firebase app  
    defaultFirebase({}),
    firebaseAuthConfig({})
  ]
})

export class MyApp {
  rootPage: any = HomePage;

  constructor(platform: Platform, public af: AngularFire) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();


      Facebook.login(['email'])
        .then((_response) => {
          console.log(_response)

          // IMPORTANT STEP !!
          let creds = firebase.auth.FacebookAuthProvider.credential(_response.authResponse.accessToken)

          this.af.auth.login(creds,
            {
              provider: AuthProviders.Facebook,
              method: AuthMethods.OAuthToken,
              remember: 'default',
              scope: ['email'],
            })
            .then((success) => {
              console.log("Firebase success: " + JSON.stringify(success));
              alert(JSON.stringify(success))
            })
            .catch((error) => {
              console.log("Firebase failure: " + JSON.stringify(error));
              alert(JSON.stringify(error))
            });

        })
        .catch((_error) => { console.log(_error) })
    });
  }
}

ionicBootstrap(MyApp);

https://cloud.google.com/sdk/downloads

Angularfire2 oauth login

1 个答案: