如何使用 ReactJs、PHP 和 MySQL 检查数据库中是否存在用户？

Question

我在 Reactjs 中创建了一个登录页面，并且在 PHP 中有一个 login_check 代码。 现在我必须检查用户是否存在于数据库中，如果存在，我想创建一个令牌，否则没有。 当用户输入他/她的详细信息时，我使用 jquery 发布数据。 但是每次它在控制台中给出一个抱歉的消息时都不知道数据是否被发布到 PHP 中。 这是我的代码。

签名文件

import React, { Component } from 'react';
import { Redirect } from 'react-router-dom'
import axios from 'axios'
import $ from 'jquery'
class Signin extends Component {
constructor(props)
{
    super(props);
    const token = localStorage.getItem("token")

    let loggedIn = true
    if(token == null)
    {
        loggedIn = false
    }

    this.state = {
        email: '',
        password: '',
        loggedIn
    }

    this.onChange = this.onChange.bind(this)
    this.submitForm = this.submitForm.bind(this)
}

onChange(e){
    this.setState({
        [e.target.name] : e.target.value
    })
}


submitForm(e){
    e.preventDefault();
    // const { email, password } = this.state

    // if(email === "admin@123" && password === "admin")
    // {
    //     localStorage.setItem("token", "loggedIn")
    //     this.setState({
    //         loggedIn: true
    //     })
    //     console.log("Logged In!")
    // }
    // else
    // {
    //     alert("Invalid email or password!");
    //     console.log("Invalid email or password!")
    // }


        $.post("http://localhost/php-react-rest-api-crud/login_check.php", function(data){
                if(data === "1")
                {
                    localStorage.setItem("token", "loggedIn")
                    console.log("success!");
                }
                else if(data === "0")
                {
                    console.log("sorry!");
                }
            })

}
render() {
    if(this.state.loggedIn)
    {
        return <Redirect to = "/admin" /> 
    }
    return (

        <div>
            <h1>Login</h1>

            <form onSubmit={this.submitForm}>
                <input type="email" name="email" placeholder="Enter email" value={this.state.email} onChange={this.onChange}/>
                <input type="password" name="password" placeholder="Enter Password" value={this.state.password} onChange={this.onChange}/>
                <br />
                <input type="submit"/>
            </form>
        </div>
    );
  }
}

export default Signin;

login_check.php

<?php

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Origin, Content-Type, Authorization, X-Auth-Token');
header("Access-Control-Allow-Methods: GET, POST");

$conn = mysqli_connect("localhost", "root", "", "farmer_portal");
if(!$conn)
{
    die('Connection error'.mysqli_connect_errno());
}


if((!isset($_POST['email'])) && (!isset($_POST['password'])))
{
   echo "0"; 
   exit();
}

$myemail = $_POST['email'];
$mypassword= $_POST['password'];


$email = "SELECT * FROM signup WHERE email='$myemail' ";
$pass = "SELECT * FROM signup WHERE password='$mypassword' ";

$myemail = stripslashes($email);
$mypassword = stripslashes($password);

$res_e = mysqli_query($conn,$myemail);
$res_p = mysqli_query($conn,$mypassword);

if(mysqli_num_rows($res_p) > 0 && mysqli_num_rows($res_e) > 0)
{
echo "1";
}
else
{
  echo "0";
}

?>

Answer 1

如果可以的话，请先了解一下您的代码

我看到您导入 Axios 但从未使用它，而是使用 jQuery 发布您的 ajax 请求。 如果这就是您使用 jQuery 的全部目的，我强烈建议您放弃它并坚持使用 Axios。 它非常擅长它的工作。

其次，只要有可能，就尽量避免多个 SQL 请求，如果您可以使用更少的 SQL 请求，或者甚至更好，只有一个。 这两个请求：

$email = "SELECT * FROM signup WHERE email='$myemail' ";
$pass = "SELECT * FROM signup WHERE password='$mypassword' ";

应合二为一：

$user_info = "SELECT * FROM signup WHERE email='$myemail' AND password='$mypassword'";

您还应该检查$myemail和$mypassword的内容。 stripslashes()不足以防止 mysql 注入。 有关该主题的更多信息，请点击此处。

永远不要相信用户输入。 始终检查您是否得到了您所期望的，在您的情况下， $myemail确实是一个电子邮件，而该password确实是一个字符串。 PHP 为此提供了两个函数， filter_var($myemail, FILTER_VALIDATE_EMAIL)和is_string($mypassword) 。

最后，也许是最重要的一点：不要存储非散列密码。 PHP 提供password_hash($mypassword)来存储密码和password_verify($mypassword)来根据数据库检查您的用户输入。

现在回答你的问题

答案在于您的 JS 代码：

$.post("http://localhost/php-react-rest-api-crud/login_check.php", function(data) {
    // ...
});

在 Axios 和 jQuery 中， post()函数的第二个参数应该是您的数据，即用户电子邮件和密码。 但是在这里，您不发送任何数据，而是直接跳转到处理对 AJAX 请求的响应。 这就是为什么 PHP 返回“0”的原因。