0
Angular 2アプリにFacebookのログイン情報を統合したい。 Facebook SDKは非同期的に読み込まれ、Observableでこの非同期呼び出しをラップしたいと思います。Angular2アプリでRxJS ObservablesにFacebookログインをラップ
fbInit() {
var deferred = Observable.create(observer => {
this._window.instance.fbAsyncInit =() => {
this._window.instance.FB.init({
appId : 'xxxxxxxxxxxxxxx',
xfbml : true,
version : 'v2.8'
});
this._window.instance.FB.AppEvents.logPageView();
console.log("fbInit");
observer.next();
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
});
return deferred;
}
（this._window.instanceがウィンドウオブジェクトを返します）
この呼び出しが成功したら、私はFBオブジェクトを使用してユーザーのログイン状態を取得したい、それがグローバルに置かれていますウィンドウオブジェクト。私はRxJsのbindCallback関数を使って通常のコールバックをObservableにラップします。
getFbStatus() {
console.log("getFbStatus");
return Observable.bindCallback(this._window.instance.FB.getLoginStatus);
}
今、私は連続して非同期に実行したいが次々照会：
1）FB SDKを初期化し、グローバルなwindowオブジェクトにFBを置く
2）チェックのログイン状態
3）んログイン状態に依存するもの
約束を使って、この作業は非常に簡単です。いくつかの研究の後、私はflatMapまたはconcatが私の問題を解決することが分かった。いずれの試みも成功しなかった。これは私が試したものです：
const initFb$ = this.fbInit();
const getFbStatus$ = this.getFbStatus();
const combined$ = Observable.concat(initFb$, getFbStatus$);
combined$.subscribe(
res => console.log(res),
err => console.error(err)
)
これを実行すると、次のエラーが発生します。
TypeError: Cannot read property 'getLoginStatus' of undefined
FacebookのSDKがロードされる前getFbStatusが、呼ばれているようです。
私はここで何が欠けていますか？ ご迷惑をおかけして申し訳ございません。