Аутентификация не удалась в реакции родной - PullRequest
0 голосов
/ 23 октября 2018

Я довольно новичок, чтобы реагировать на нативные, и я использую Firebase для реализации аутентификации в моем приложении.Однако, несмотря на ввод правильного адреса электронной почты и пароля, я не могу войти в систему. Он всегда показывает, что аутентификация не пройдена и должна отображаться только для неправильного адреса электронной почты / пароля.Я также добавил пользователей в консоль Firebase, но приложение по-прежнему не принимает аутентификацию.

Reducer.js

import {EMAIL_CHANGED,PASSWORD_CHANGED,LOGIN_USER,LOGIN_USER_FAILED,LOGIN_USER_SUCCESS} from '../components/actions/types';

const INITIAL_STATE={email:'',password:'',user:null,error:'',loading:false};

export default (state=INITIAL_STATE,action) => {
  switch(action.type){
    case EMAIL_CHANGED:
    return {...state,email:action.payload};
    case PASSWORD_CHANGED:
    return {...state,password:action.payload};
    case LOGIN_USER:
    return{...state,loading:true,error:''};
    case LOGIN_USER_SUCCESS:
    return {...state,...INITIAL_STATE,user:action.payload};
    case LOGIN_USER_FAILED:
    return {...state,...INITIAL_STATE,error: 'Authentication Failed',loading:false};
    default:
    return state;
  }
};

LoginForm.js

import React,{Component} from 'react';
import {Card,CardSection,Input,Button,Spinner} from './common';
import {View,Text} from 'react-native';
import {connect} from 'react-redux';
import {EmailChanged,PasswordChanged,LoginUser} from './actions';

class LoginForm extends Component {
  onEmailChange(text){
    this.props.EmailChanged(text);

  }
  onPassWordChange(text){
    this.props.PasswordChanged(text);
  }
  onButtonPress(text){
    this.props.LoginUser(this.props.email,this.props.password);
  }
  onError(){
    if(this.props.error){
      return(
        <View>
          <Text style={styles.errorTextStyle}>{this.props.error}</Text>
        </View>
      );
    }

  }
  onRenderButton(){
    if(this.props.loading){
      return <Spinner size="large"/>
    }
    else{
      return(
          <Button onPress={this.onButtonPress.bind(this)}>
          Log In
          </Button>
      );
    }
  }
  render(){
    return (
        <Card>
          <CardSection>
              <Input 
              label = "Email"
              placeholder = "email@gmail.com"
              onChangeText = {this.onEmailChange.bind(this)}
              value={this.props.email}
              />
          </CardSection>
          <CardSection>
              <Input 
              secureTextEntry
              label = "PassWord"
              placeholder = "password"
              onChangeText={this.onPassWordChange.bind(this)}
              value={this.props.password}
              />

          </CardSection>
          {this.onError()}
          <CardSection>
              {this.onRenderButton()}
          </CardSection>
        </Card>
    );
  }
}
const mapStateToProps=(state)=>{
  return {
    email:state.auth.email,
    password:state.auth.password,
    error:state.auth.error,
    user:state.auth.user,
    loading:state.auth.loading
    };

};

const styles = {
  errorTextStyle: {
    fontSize: 20,
    alignSelf: 'center',
    color: 'red'
  }
};



export default connect(mapStateToProps,{EmailChanged,PasswordChanged,LoginUser})(LoginForm);

ActionCreator

import {EMAIL_CHANGED,PASSWORD_CHANGED,LOGIN_USER,LOGIN_USER_FAILED,LOGIN_USER_SUCCESS} from './types';
import firebase from 'firebase';
import {Actions} from 'react-native-router-flux';

export const EmailChanged = (text) => {
  return {
    type: EMAIL_CHANGED,
    payload:text
  };
}

export const PasswordChanged = (text) => {
  return {
    type:PASSWORD_CHANGED,
    payload:text
  };
}

export const LoginUser = ({email,password}) =>{
  return(dispatch) => {
    dispatch({type:LOGIN_USER});
      firebase.auth().signInWithEmailAndPassword("email","password")
      .then(user=> loginUserSuccess(dispatch,user))
        .catch((error) => {
          firebase.auth().createUserWithEmailAndPassword("email","password")
          .then(user => loginUserSuccess(dispatch,user))
            .catch(() => loginUserFail(dispatch));
          });


  };

}
const loginUserFail = (dispatch) => {
  dispatch({type:LOGIN_USER_FAILED});
};

const loginUserSuccess = (dispatch,user) => {
  dispatch({type:LOGIN_USER_SUCCESS,payload:user});
  Actions.list();
};

App.js

import React, {Component} from 'react';
import { Text, View, StyleSheet } from 'react-native';
import { Constants } from 'expo';
import {Provider} from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import reducers from './src/reducers';
import firebase from 'firebase';
import LoginForm from './src/components/LoginForm';
import ReduxThunk from 'redux-thunk';
import Router from './src/Router';
class App extends Component {
  componentWillMount() {
     const config = {
    apiKey: 'AIzaSyDyF8h7SYE3iiYxt-ZAmdXxWu9Pd6cuvxo',
    authDomain: 'manager-31000.firebaseapp.com',
    databaseURL: 'https://manager-31000.firebaseio.com',
    projectId: 'manager-31000',
    storageBucket: 'manager-31000.appspot.com',
    messagingSenderId: '1079074827203'
  };
  if (!firebase.apps.length) {
  firebase.initializeApp(config);
}


  }
  render(){

    const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));

    return(
      <Provider store = {store}>
      <Router />
      </Provider>
    );
  }
}
export default App;
...