Javascript 应用程序使用以前输入的凭据登录（使用firebase进行本机响应）

我正在开发一个消息传递应用程序，其中用户可以注册/登录以与其他用户交谈。 成功登录后，用户必须能够看到除自己以外的所有注册用户。当我尝试使用任何帐户登录时，我是使用以前输入的凭据登录的。 我在世博会上使用React Native。当我第一次运行应用程序并尝试登录（比如以帐户A登录）时，它以某种方式经过身份验证，我能够看到所有注册用户，包括我自己，即A。 此外，当我注销并尝试使用其他帐户（比如帐户B）登录时，我会使用帐户A的详细信息登录，并且会显示除（帐户A）之外的所有注册用户。 同样，如果我注销并尝试使用任何其他帐户（例如帐户C或A）登录，我将使用帐户B的详细信息而不是帐户C或A的详细信息登录。 为清晰起见，附加一些图像：

1） 当我第一次登录时（电子邮件：newuser@gmail.com，密码：123456） 结果：已验证，但包括self在内的所有用户都显示在登录屏幕上。

2） 以其他用户身份注销和登录（电子邮件：test3@gmail.com，密码：test123） 结果：使用以前输入的凭据进行身份验证，即使用电子邮件登录：newuser@gmail.com，密码：123456）。

3） 注销并再次登录时使用与前一个相同的凭据（电子邮件：test3@gmail.com，密码：test123） 结果：使用以前输入的凭据进行身份验证，即使用电子邮件登录：test3@gmail.com，密码：test123.

Login.js

import { View, Text, StyleSheet, TouchableOpacity, TextInput, Image, ImageBackground, ScrollView, AsyncStorage } from 'react-native'
import firebaseSvc from '../config/firebaseSDK'


export default class Login extends Component {

static navigationOptions = {
  title: 'Login',
};
constructor(props) {
  super(props)
  this.state = {
    name: '',
    email: '',
    password: '',
    user_Data: '',
    uid: '',
    username: '',
    uemail: ''
  };
}


onPressLogin = () => {
  var user = {

    email: this.state.email,
    password: this.state.password,
    //avatar: this.state.avatar,
  }


  const response = firebaseSvc.login(
    user,
    this.loginSuccess,
    this.loginFailed,
  )


  this.Data_match()



}

Data_match = () => {
  firebaseSvc.loginData().then((solve) => {
    this.setState({ user_Data: solve })
  }).then(() => {
    let x = this.state.user_Data
    this.setState({
      uid: x.uid,
      username: x.displayName,
      uemail: x.email
    })

  }).catch((fail) => {
    console.log('not getting data.....')
  })
}

loginSuccess = () => {



  this.props.navigation.navigate('Users', {
    name: this.state.name,
    email: this.state.email,
    avatar: this.state.avatar,
    uid: this.state.uid,
    username: this.state.username,
    uemail: this.state.uemail
  })


   console.log(
     'uid=> '+this.state.uid+
     '  username=> '+this.state.username+
     '  useremail=> '+this.state.uemail
   )

}
loginFailed = () => {
  console.log('login failed ***');
  alert('Login failed.');
}
onChangeTextEmail = email => this.setState({ email:email });
onChangeTextPassword = password => this.setState({ password:password });

render() {
  return (
    <View style={styles.container}>
      <ImageBackground style={styles.loginbox}  >
        <ScrollView>
          <View style={styles.padding_btm}>
            <TextInput style={styles.input}
              keyboardType='email-address'
              placeholder='Email or Mobile Num'
              onChangeText={this.onChangeTextEmail}
              value={this.state.email}
            />
            <TextInput style={styles.input}
              placeholder='Password'
              secureTextEntry
              onChangeText={this.onChangeTextPassword}
              value={this.state.password}
            />

            <TouchableOpacity style={styles.buttonContainer} onPress={this.onPressLogin}>
              <Text style={styles.buttonText}>LOGIN</Text>
            </TouchableOpacity>
            <TouchableOpacity style={styles.buttonContainer} onPress={() => 
              this.props.navigation.navigate("Signup")}>
              <Text style={styles.buttonText}>CREATE ACCOUNT NOW</Text>
            </TouchableOpacity>
          </View>
        </ScrollView>
      </ImageBackground>
    </View>
  )
}
}
const styles = StyleSheet.create({...})

import firebase from 'firebase';
import 'firebase/firestore'


const config = {
  apiKey: 'XXX',
  authDomain: 'XXX',
  databaseURL: 'XXX',
  projectId: 'XXX',
  storageBucket: 'XXX',
  messagingSenderId: 'XXX'
}
class FirebaseSvc {
  constructor(props) {

    if (!firebase.apps.length) {
      firebase.initializeApp(config);
    } else {
      console.log("firebase apps already running...")
    }
  }

  authData=(email)=>{
    firebase
    .database()
    .ref('users')
    .orderByChild('emailAddress')
    .equalTo(email)
    .once('value', snap => console.log('this is authantcation data==> '+snap.val()))
  }

  login (user, success_callback, failed_callback) {
    console.log("RECEVING SIDE:"+user.email+" "+user.password)

    const output =  firebase.auth().signInWithEmailAndPassword(user.email,
    user.password).then(success_callback, failed_callback)


  }

  loginData=()=>{
          return new Promise((resolve,reject)=>{
            firebase.auth().onAuthStateChanged(function(user) {
              if (user) {
                //console.log("user: ", user);
                resolve(user)
                // User is signed in.
              } else {
                // No user is signed in.
            } 
      }) 
    }) 
  }

  observeAuth = () =>{
    console.log("OBSERVING LOGOUT")
    firebase.auth().onAuthStateChanged(this.onAuthStateChanged);
  }
  onAuthStateChanged = user => {
    if (!user) {
      try {
        this.login(user);
      } catch ({ message }) {
        console.log("Failed:" + message)
      }
    } else {
      console.log("Reusing auth...");
    }
  }

  createAccount = async (user) => {
    return new Promise((resolve,reject)=>{
    firebase.auth()
      .createUserWithEmailAndPassword(user.email, user.password)
      .then(function(pass){
        var userf = firebase.auth().currentUser;
        userf.updateProfile({ displayName: user.name})
        .then(function() {
           firebase.firestore().collection("fb_user").doc(pass.user.uid).set({
            uid: pass.user.uid,
            email: pass.user.email,
            name:user.name,
            emailVerified:pass.user.emailVerified
        })
        .then(function() {
            console.log("Document successfully written!");
        })
        .catch(function(error) {
            console.error("Error writing document: ", error);
        });  
          alert("User " + user.name + " was created successfully. Please login.")
        }, function(error) {
          console.warn("Error update displayName.");
        });
      }, function(error) {
        console.error("got error:" + typeof(error) + " string:" + error.message);
        alert("Create account failed. Error: "+error.message);
      })
    })
  }  



  onLogout = user => {
     firebase.auth().signOut().then(() =>{

      console.log("Sign-out successful.");

    }).catch(function(error) {
      console.log("An error occured while signing out:"+error);
    });

  }
 . // miscellaneous code 
 .
 .
  get uid() {
    return (firebase.auth().currentUser || {}).uid;
  }

  get timestamp() {
    return firebase.database.ServerValue.TIMESTAMP;
  }



}

const firebaseSvc = new FirebaseSvc();
export default firebaseSvc;

我非常怀疑这个问题是否与“setState”是一个异步函数有关，也许我在错误的地方触发了登录事件。然而，我不清楚，也不确定根本原因。 如有任何帮助或建议，将不胜感激。

---

谢谢。

我认为这部分代码导致了错误：-

 const response = firebaseSvc.login(
user,
this.loginSuccess,
this.loginFailed,
 )
this.Data_match()

可能在这里，您的LoginSAccess（）在Data_match（）之前运行，因此它使用变量的上一个状态进行导航，因为状态正在Data_match（）中更新。 因此，在firebaseSvc.login回调中传递this.Data_match（）而不是loginsucess。 添加，数据_match（）中的导航逻辑

这意味着loginsucess函数现在已经过时

试试看

---

希望对你有帮助

我认为这部分代码是导致错误的原因：-

 const response = firebaseSvc.login(
user,
this.loginSuccess,
this.loginFailed,
 )
this.Data_match()

可能在这里，您的LoginSAccess（）在Data_match（）之前运行，因此它使用变量的上一个状态进行导航，因为状态正在Data_match（）中更新。 因此，在firebaseSvc.login回调中传递this.Data_match（）而不是loginsucess。 添加，数据_match（）中的导航逻辑

这意味着loginsucess函数现在已经过时

试试看

---

希望对你有帮助

按建议试过了。问题仍然存在。请尝试在Data_match（）的回调中导航。是的，LoginSAccess是在Data_match（）之前启动的，因此，它是使用以前的状态导航的。如前所述进行了更改。现在效果很好。按建议试过了。问题仍然存在。请尝试在Data_match（）的回调中导航。是的，LoginSAccess是在Data_match（）之前启动的，因此，它是使用以前的状态导航的。如前所述进行了更改。现在效果很好。