https://reactnativecode.com/react-native-user-login-using-php-mysql/ 我正在按照上面的链接做一个简单的登录应用程序,因此我想在登录后获取user_id但失败了,有人可以告诉我如何在登录后显示user_id吗?
下面是php的代码
<?php
// Importing DBConfig.php file.
include 'DBConfig.php';
// Creating connection.
$con = mysqli_connect($HostName,$HostUser,$HostPass,$DatabaseName);
// Getting the received JSON into $json variable.
$json = file_get_contents('php://input');
// decoding the received JSON and store into $obj variable.
$obj = json_decode($json,true);
// Populate User email from JSON $obj array and store into $email.
$email = $obj['email'];
// Populate Password from JSON $obj array and store into $password.
$password = $obj['password'];
//Applying User Login query with email and password match.
$Sql_Query = "select * from user where email = '$email' and password = '$password' ";
// Executing SQL Query.
$check = mysqli_fetch_array(mysqli_query($con,$Sql_Query));
if(isset($check)){
$SuccessLoginMsg = 'Data Matched';
// Converting the message into JSON format.
$SuccessLoginJson = json_encode($SuccessLoginMsg);
// Echo the message.
echo $SuccessLoginJson ;
}
else{
// If the record inserted successfully then show the message.
$InvalidMSG = 'Invalid Username or Password Please Try Again' ;
// Converting the message into JSON format.
$InvalidMSGJSon = json_encode($InvalidMSG);
// Echo the message.
echo $InvalidMSGJSon ;
}
mysqli_close($con);
?>
这是响应本机代码,允许用户登录
import React, { Component } from 'react';
import { StyleSheet, TextInput, View, Alert, Button, Text} from 'react-native';
// Importing Stack Navigator library to add multiple activities.
import { StackNavigator } from 'react-navigation';
// Creating Login Activity.
class LoginActivity extends Component {
// Setting up Login Activity title.
static navigationOptions =
{
title: 'LoginActivity',
};
constructor(props) {
super(props)
this.state = {
UserEmail: '',
UserPassword: ''
}
}
UserLoginFunction = () =>{
const { UserEmail } = this.state ;
const { UserPassword } = this.state ;
fetch('http://localhost/login/login.php', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
email: UserEmail,
password: UserPassword
})
}).then((response) => response.json())
.then((responseJson) => {
// If server response message same as Data Matched
if(responseJson === 'Data Matched')
{
//Then open Profile activity and send user email to profile activity.
this.props.navigation.navigate('Second', { Email: UserEmail });
}
else{
Alert.alert(responseJson);
}
}).catch((error) => {
console.error(error);
});
}
render() {
return (
<View style={styles.MainContainer}>
<Text style= {styles.TextComponentStyle}>User Login Form</Text>
<TextInput
// Adding hint in Text Input using Place holder.
placeholder="Enter User Email"
onChangeText={UserEmail => this.setState({UserEmail})}
// Making the Under line Transparent.
underlineColorAndroid='transparent'
style={styles.TextInputStyleClass}
/>
<TextInput
// Adding hint in Text Input using Place holder.
placeholder="Enter User Password"
onChangeText={UserPassword => this.setState({UserPassword})}
// Making the Under line Transparent.
underlineColorAndroid='transparent'
style={styles.TextInputStyleClass}
secureTextEntry={true}
/>
<Button title="Click Here To Login" onPress={this.UserLoginFunction} color="#2196F3" />
</View>
);
}
}
// Creating Profile activity.
class ProfileActivity extends Component
{
// Setting up profile activity title.
static navigationOptions =
{
title: 'ProfileActivity',
};
render()
{
const {goBack} = this.props.navigation;
return(
<View style = { styles.MainContainer }>
<Text style = {styles.TextComponentStyle}> { this.props.navigation.state.params.Email } </Text>
<Button title="Click here to Logout" onPress={ () => goBack(null) } />
</View>
);
}
}
export default MainProject = StackNavigator(
{
First: { screen: LoginActivity },
Second: { screen: ProfileActivity }
});
const styles = StyleSheet.create({
MainContainer :{
justifyContent: 'center',
flex:1,
margin: 10,
},
TextInputStyleClass: {
textAlign: 'center',
marginBottom: 7,
height: 40,
borderWidth: 1,
// Set border Hex Color Code Here.
borderColor: '#2196F3',
// Set border Radius.
borderRadius: 5 ,
},
TextComponentStyle: {
fontSize: 20,
color: "#000",
textAlign: 'center',
marginBottom: 15
}
});