Ionic AngularFire Firebase Facebookログイン

Question

I meatはIonicに問題があります。私はそれを説明します。

私は、Firebaseを使用するためにIonic 2とAngularFire 2を使用します。だから私は自分のデータベースにアクセスし、Facebookでログインすることができます。私は、この関数を呼び出すためのボタンを使用します。

this.af.auth.login({ 
    provider: AuthProviders.Facebook, 
    method: AuthMethods.Popup 
}).then(function(response){ 
    console.log('facebook login ', response); 
}); 

すべては、イオンラボに素晴らしい作品。しかし、私のデバイスで私のアプリをテストすると、ボタンは何もポップアップやリダイレクトの仕事をしません。あなたはそれで私を助けることができますか？あなたはいくつかの点を修正する必要が

Answer 1

は、私はFacebookのログインにコルドバを使用：

あなたのログエラーを共有していなかったが、私はあなたがこれを行う必要がありますと思う：あなたのFacebookアプリで

を： 新しいプラットフォーム、Android、またはIOSを追加する（使用しているとは言わなかった）。

はコルドバのプラグインを追加します。

ionic plugin add cordova-plugin-facebook4 --save --variable APP_ID="999999999" --variable APP_NAME="myApplication" 

は、あなたのFacebookアプリIDと名前を使用してください。

のアプリでイオン - ネイティブのインストール：

npm install ionic-native --save 

は、あなたのコード内でFacebookのインポートを追加します。

import { Facebook } from 'ionic-native'; 

とコルドバのログインを使用するためのあなたの方法を変更する：

loginWithFacebook() { 
    return Observable.create(observer => { 
     if (this.platform.is('cordova')) { 
     Facebook.login(['public_profile', 'email']).then(facebookData => { 
      let provider = firebase.auth.FacebookAuthProvider.credential(facebookData.authResponse.accessToken); 
      console.log('facebook accessToken: '+facebookData.authResponse.accessToken); 
      firebase.auth().signInWithCredential(provider).then(firebaseData => { 
      console.log('facebook login ', firebaseData); 
      observer.next(); 
      }).catch(function(error) { 
      // Handle Errors here. 
      console.log("error"); 
      console.log(error); 
      // ... 
      }); 
     }, error => { 
      observer.error(error); 
     }); 
     } else { 

     this.af.auth.login({ 
      provider: AuthProviders.Facebook, 
      method: AuthMethods.Popup 
     }).then((response) => { 
      console.log('facebook login ', response); 
      observer.next(); 
     }).catch((error) => { 
      console.info("login", error); 
      observer.error(error); 
     }); 
     } 
    }); 
    } 

注：あなたのアプリが開発中の場合は、開発者だけがログインできます。

Answer 2

上記のコードは、これを行うことにより、単にhereを与えaxampleようAuthProvider内での使用のために簡略化することができます。

signInWithFacebook(): firebase.Promise<any> { 
    if (this.platform.is('cordova')) { 
    return Facebook.login(['public_profile', 'email']).then(facebookData => { 
     let provider = firebase.auth.FacebookAuthProvider.credential(facebookData.authResponse.accessToken); 
     console.log('facebook accessToken: ' + facebookData.authResponse.accessToken); 
     return firebase.auth().signInWithCredential(provider); 
    }); 
    } else { 
    return this.auth$.login({ 
     provider: AuthProviders.Facebook, 
     method: AuthMethods.Popup 
    }); 
    } 
}