Firebase与React-Native IOS应用程序的集成失败

Question

I am trying to integrate the Firebase service with React-Native framework. I am trying to follow this tutorial in Udemy: https://www.udemy.com/the-complete-react-native-and-redux-course/

Steps I followed:

1. Downloaded firebase using npm command: npm install --save react-native-firebase
2. Created a project in the firebase console.

3. Pasted the config created by Firebase in the React-native code.

   class App extends Component {

    componentWillMount() { firebase.initializeApp({ apiKey: 'AIzaSyAMuW4adFuW_XoYvpvke_iHTvlAkuVJ7Fk', authDomain: 'authproj2.firebaseapp.com', databaseURL: 'https://authproj2.firebaseio.com', projectId: 'authproj2', storageBucket: 'authproj2.appspot.com', messagingSenderId: '654736603029' }); firebase.auth().onAuthStateChanged((user) => { if(user) { this.setState( {loggedIn:true} ); } else { this.setState( {loggedIn: false } ); } }); 

   } }

And in a different React component I am creating aa Login Form which has a Submit button.

The onButtonPress function is :

    onButtonPress () {
    const { email , password } = this.state;

    this.setState({error: '', loading: true});

    firebase.auth().signInWithEmailAndPassword(email, password)
    .then(this.onLoginSuccess.bind(this))
    .catch(() => {
        firebase.auth().createUserWithEmailAndPassword(email, password)
        .then(this.onLoginSuccess.bind(this))
        .catch(this.onLoginFailure.bind(this));
    });
    }

These are the onLoginSuccess and OnLoginFailure functions:

onLoginSuccess () {
this.setState( {email:'', password:'', error:'', loading:false});

}

onLoginFailure () {
this.setState( {error: "Authentication Failure!!", loading:false } );

}

But when I click on the button no action takes place. Ideally it should create an a new account if the email and password are entered for the first time and show a different page if the email and password are correct. But somewhere the integration of Firebase with React-native is going wrong.

Answer 1

You are using web SDK which requires firebase package but you have got react-native-firebase package installed.

If you want to go ahead with the code and firebase you have written then you should install firebase package.

To solve your problem you should install firebase package

However to properly leverage firebase in mobile environment, it is recommended to use react-native-firebase but in that case, the firebase.initializeApp({ becomes meaningless as the firebase initialization in mobile happens using Google-services.json and Google-services.plist files provided by firebase console in android and iOS respectively when using the react-native-firebase package.

If you want to go with react-native-firebase please refer this .