8

React NativeでFirebase Twitter認証を使用するには?

https://www.firebase.com/docs/web/guide/login/twitter.htmlを参照して、以下の両方のコードを試しました

var Firebase = require("firebase");

var App = React.createClass({

  render: function() {
    return (
      <View>
        <Text onPress={this._handlePress}>
          Twitter login
        </Text>
      </View>
    );
  },

  _handlePress: function () {
    var myApp = new Firebase("https://<myapp>.firebaseio.com");

    myApp.authWithOAuthRedirect("twitter", function(error) {
      if (error) {
        console.log("Login Failed!", error);
      } else {
        // We'll never get here, as the page will redirect on success.
      }
    });

  }

});

と

var Firebase = require("firebase");

var App = React.createClass({

  render: function() {
    return (
      <View>
        <Text onPress={this._handlePress}>
          Twitter login
        </Text>
      </View>
    );
  },

  _handlePress: function () {
    var myApp = new Firebase("https://<myapp>.firebaseio.com");

    myApp.authWithOAuthPopup("twitter", function(error, authData) {
      if (error) {
        console.log("Login Failed!", error);
      } else {
        console.log("Authenticated successfully with payload:", authData);
      }
    });

  }

});

を使用するauthWithOAuthRedirectと、次のようなエラーが発生しました

undefined is not an object (evaluating 'window.location.href')

を使用するauthWithOAuthPopupと、何も起こりませんでした。

どうすれば質問を解決できますか? それとも無理ですか？

4

2 に答える 2

3

これは、Web用の Firebase Twitter 統合です。その祖先と JavaScript の使用にもかかわらず、React Native は決して Web ではありません。DOM もブラウザーも持っていないため、現在のウィンドウをリダイレクトする機能がありません。これは、このコードが行おうとしていることのようです。

ですから、あなたの質問に答えるために、このライブラリをそのまま使用することはできません。ブラウザー スタイルのフローを使用せずにやりたいことを行うには、Obj-C で拡張機能を作成する必要がある場合があります。

于 2015-06-12T09:49:38.537 に答える
1

私は解決策をまとめました...仕事を成し遂げるために使用できるよりクリーンなアプローチがあると確信していますが、私が達成したことの上に構築することができます

/**
* login in the user with the credentials, gets the whole process 
* started, [NOTE] probably can just construct the url myself?
*/
_doGitHubLogin() {
    this.props.fbRef.authWithOAuthRedirect("github", function (error) {
        if (error) {
            console.log("Authentication Failed!", error);
        } else {
            console.log("Authenticated successfully with payload:", authData);
        }
    });
}

componentDidMount() {

    // set this interval to check for me trying to redirect the window...
    var that = this
    that.inter = setInterval(function () {
        if (window.location && window.location.split) {

            // set the redirect on the url..
            var newLocation = window.location.split("redirectTo=null")[0]
            newLocation = newLocation + "redirectTo=https://auth.firebase.com/v2/clearlyinnovative-firebasestarterapp/auth/github/callback"

            // open the browser...
            that.setState({ url: newLocation })

            // clear the interval to stop waiting for the location to be set..
            clearInterval(that.inter)
        }
    }, 3000);


    this.props.fbRef.onAuth((_auth) => {
        console.log(_auth)
        this.setState({ auth: _auth })
    });
}

ここで完全な説明を参照してください... https://github.com/aaronksaunders/rn-firebase-demo

于 2016-05-17T04:02:28.297 に答える