Cách sử dụng Xác thực Twitter Firebase với React Native?

Question

Cách sử dụng Xác thực Twitter Firebase với Phản ứng gốc?

tôi đã cố gắng cả hai mã dưới đây vào tham chiếu đến 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. 
     } 
    }); 

    } 

}); 

và

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

    } 

}); 

Khi tôi sử dụng authWithOAuthRedirect, một lỗi xảy ra như

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

Khi tôi sử dụng authWithOAuthPopup , không có chuyện gì xảy ra.

Tôi làm cách nào để giải quyết câu hỏi? Hoặc là không thể?

Answer 1

Đây là tích hợp Twitter Firebase cho web. Mặc dù tổ tiên của nó và sử dụng JavaScript của nó, React Native là không có cách nào web; bạn không có DOM, bạn không có trình duyệt và do đó bạn không có khả năng chuyển hướng cửa sổ hiện tại, có vẻ như mã này đang cố gắng thực hiện.

Vì vậy, để trả lời câu hỏi của bạn, hãy sử dụng thư viện này vì nó sẽ không thể thực hiện được. Bạn có thể tìm thấy bạn phải viết một phần mở rộng trong Obj-C để làm những gì bạn muốn làm mà không cần sử dụng luồng kiểu trình duyệt.

Answer 2

tôi bị tấn cùng một giải pháp ... Tôi chắc chắn có một cách tiếp cận sạch hơn có thể được sử dụng để hoàn thành công việc, nhưng bạn có thể xây dựng trên những gì tôi đã hoàn thành

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

Xem giải thích đầy đủ ở đây ... https://github.com/aaronksaunders/rn-firebase-demo