Jak korzystać z uwierzytelniania w usłudze Firebase na Twitterze za pomocą polecenia Natywne?

Question

Jak korzystać z uwierzytelniania w usłudze Firebase na Twitterze za pomocą polecenia Natywne?

Próbowałem zarówno z poniższego kodu w odniesieniu do 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. 
     } 
    }); 

    } 

}); 

i

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); 
     } 
    }); 

    } 

}); 

Gdy używam authWithOAuthRedirect, wystąpił błąd jak

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

Gdy używam authWithOAuthPopup , nic się nie stało.

Jak mogę rozwiązać pytanie? A może to nie jest możliwe?

Answer 1

To jest integracja z Firebase na Twitterze dla domeny sieci. Pomimo swojego pochodzenia i używania JavaScriptu, React Native nie jest w żaden sposób siecią; nie masz DOM, nie masz przeglądarki, więc nie masz możliwości przekierowania bieżącego okna, co wydaje się być tym, co ten kod próbuje zrobić.

Aby odpowiedzieć na Twoje pytanie, korzystanie z tej biblioteki w obecnej postaci nie będzie możliwe. Może się okazać, że musisz napisać rozszerzenie w Obj-C, aby zrobić to, co chcesz zrobić bez korzystania z przepływu w stylu przeglądarki.

Answer 2

I hacked razem rozwiązanie ... Jestem pewien, że jest czystsze podejście, które może być wykorzystane do wykonania swojej pracy, ale można budować na tym, co udało się osiągnąć

/** 
* 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 }) 
    }); 
} 

Zobacz pełne wyjaśnienie tutaj ... https://github.com/aaronksaunders/rn-firebase-demo