React Native + react-native-oauthでFirebase Authを実装する

React NativeアプリでTwitterを使用しているユーザを認証します。私は、反応したネイティブのoauthライブラリを使用しています。https://github.com/fullstackreact/react-native-oauth React Native + react-native-oauthでFirebase Authを実装する

私はこれを最も効果的な方法で実行していますか？

まず物事は最初、私は私のredux/authenticationで、私はおそらくこのような何かをするだろう、そして、私は今

反応し、ネイティブのOAuthライブラリをインストールconfig/constantsファイル

import firebase from 'firebase' 

firebase.initializeApp({ 
    apiKey: "MY-API-KEY", 
    authDomain: "MY-AUTH-DOMAIN", 
    databaseURL: "MY-DATABASE-URL", 
    storageBucket: "MY-STORAGE-BUCKET", 
    messagingSenderId: "MY-MESSAGING-ID" 
}); 

const ref = firebase.database().ref() 
const firebaseAuth = firebase.auth() 

export { ref, firebaseAuth }

に私のアプリにfirebaseを追加私は最終的に応答オブジェクトを私のredux認証状態に保存して後で使用するアクションをディスパッチします。

import OAuthManager from 'react-native-oauth'; 

const manager = new OAuthManager('Nimbus') // I'm sort of confused on what the name of the app should be. Is it just the name of the app when I ran react-native init? Or something else? 

export default function handleAuthWithFirebase() { 

    // Some redux thunk 

    return function (dispatch, getState) { 
     dispatch(authenticating()); 
     manager.configure({ 
      twitter: { 
       consumer_key: 'SOME_CONSUMER_KEY', 
       consumer_secret: 'SOME_CONSUMER_SECRET' 
      }, 
     }); 

     manager.authorize('twitter', {scopes: 'profile email'}) 
      .then(resp => dispatch(getProfile(resp))) // Save response object 
      .catch(err => console.log('There was an error')); 

     // Do some other stuff like pushing a new route, etc. 
    } 
}

その後ようやく、SplashContainer.jsに私は（最終的にプレゼンテーションコンポーネントによって呼び出される）handleSignInメソッドにこれを追加します。

import React, { PropTypes, Component } from 'react' 
import { View, Text } from 'react-native' 

// Import function 
import { handleAuthWithFirebase } from '~/redux/modules/authentication' 
import { Splash } from '~/components' 

export default class SplashContainer extends Component { 
    handleSignIn =() => { 
     // Sign in user with Twitter 
     handleAuthWithFirebase.bind(this); 
    } 
    render() { 
     return (
      <Splash handleSignIn={this.handleSignIn}/> 
     ) 
    } 
}

申し訳ありませんが、私はそれがたくさんあったと知っていますが、これを正しく実装していることを確認したいと思います。フローを改善するための提案があれば歓迎されます。ありがとう！

出典

2017-02-07 maxwellgover