通过 AJAX 重定向到 PHP 中的另一个页面答案

【问题标题】：Redirect to another page in PHP through AJAX通过 AJAX 重定向到 PHP 中的另一个页面
【发布时间】：2019-09-25 19:59:42
【问题描述】：

我的页面正在从 javascript 收集信息并将其发送到 PHP，然后再发送到 MySQL，问题是我希望它根据我在数据库中的数据重定向到不同的页面，我尝试使用 header 但它只是向我显示警报中其他页面的整个 HTML 代码，我不希望这样。我希望它根据条件重定向到一个页面或另一个页面

HTML (Login.html)

<div class="wrap-input100 validate-input" data-validate = "Enter username">
<input class="input100" type="text" id="user" name="username" placeholder="Email">
<span class="focus-input100" data-placeholder="&#xf207;"></span>
</div>

<div class="wrap-input100 validate-input" data-validate="Enter password">
<input class="input100" type="password" id="pass" name="pass" placeholder="Password">
<span class="focus-input100" data-placeholder="&#xf191;"></span>
</div>

<div class="container-login100-form-btn">
<a class="login100-form-btn" id = "logBtn">
Login
</a>
</div>

脚本

$('#logBtn').click(function(event){ 
    user = document.getElementById("user").value;
    password = document.getElementById("pass").value;

    $.ajax({
        type:"POST",
        url:"login.php",
        async: false,
        data: {user:user,password:password},
        success: function(data){
        alert(data);
        //window.location = '../Main/index.html';
        }
        });
    });

PHP

<?php
$servername = "localhost";
$username = "root";
$password = "tbjdjkdl";
$dbname = "dbbbbbb";

$conn = new mysqli($servername, $username, $password, $dbname);

$user = $_POST['user'];
$pass = $_POST['password'];

$sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass'"; 
$result = mysqli_query($conn, $sql);

if (mysqli_num_rows($result) > 0) {
    $sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass' AND permisos='Administrador'";
    if (mysqli_num_rows($result) > 0){
        echo "admin";
        header('Location: ../Main/index.html');
        exit;
    }
    else{
    echo "user";
    header('Location: ../Main/startemp.html');
    exit;
    }

 } else {
    $msg = "username/password invalid";
    echo $msg;
 }

mysqli_close($conn);
?>

【问题讨论】：

永远不要将 $_POST 变量直接用于 SQL 查询！这使得 SQL 注入变得非常容易！
@PeterKraume 我应该使用什么？
永远不要相信输入数据！您需要验证和清理您的参数。以w3schools.com/php/php_filter.asp 为起点。

标签： javascript php html ajax

【解决方案1】：

使用正确的 AJAX 格式来处理客户端的响应这里是修改后的代码

      <div class="wrap-input100 validate-input" data-validate = "Enter username">
      <input class="input100" type="text" id="user" name="username" placeholder="Email">
      <span class="focus-input100" data-placeholder="&#xf207;"></span>
      </div>

      <div class="wrap-input100 validate-input" data-validate="Enter password">
      <input class="input100" type="password" id="pass" name="pass" placeholder="Password">
      <span class="focus-input100" data-placeholder="&#xf191;"></span>
      </div>

      <div class="container-login100-form-btn">
      <a class="login100-form-btn" id = "logBtn">
      Login
      </a>
      </div>
      <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
      <script>
      $('#logBtn').click(function(event){ 
          user = document.getElementById("user").value;
          password = document.getElementById("pass").value;

          $.ajax({
              type:"POST",
              url:"login.php",
              async: false,
              data: {user:user,password:password},
              success: function(data){
              alert(data);
          if(data=="admin"){
                  window.location="https://..Main/index.html";
                }
        if(data=="user"){
                  window.location="https://....startemp.html";
                }
              }
              });
          });

      </script>

      <?php

      $servername = "localhost";
      $username = "root";
      $password = "root";
      $dbname = "test";

      $conn = new mysqli($servername, $username, $password, $dbname);

      $user = $_POST['user'];
      $pass = $_POST['password'];

      $sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass'"; 

      $result = mysqli_query($conn, $sql);

      if (mysqli_num_rows($result) > 0) {
          $sql_1 = "SELECT * FROM users WHERE email='$user' AND clave='$pass' AND permisos='Administrador'";
           $result_1 = mysqli_query($conn, $sql_1);
          if (mysqli_num_rows($result_1) > 0){

              echo "admin";
              exit(0);
            }
             else{
          echo "user"; 
           exit(0);
          }

       } else {
          $msg = "username/password invalid";
          echo $msg;
       }

      mysqli_close($conn);
      ?>

【讨论】：

【解决方案2】：

使用正确的 JSON 格式来处理客户端的响应这里是修改后的代码

<?php
$servername = "localhost";
$username = "root";
$password = "tbjdjkdl";
$dbname = "dbbbbbb";

$conn = new mysqli($servername, $username, $password, $dbname);

$user = $_POST['user'];
$pass = $_POST['password'];

$sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass'";
$result = mysqli_query($conn, $sql);

if (mysqli_num_rows($result) > 0) {
    $sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass' AND permisos='Administrador'";
    if (mysqli_num_rows($result) > 0) {
        echo json_encode(['status' => 'success', 'url' => '../Main/index.html']);
        exit;
    } else {
        echo json_encode(['status' => 'success', 'url' => '../Main/startemp.html']);
        exit;
    }
} else {
    $msg = "username/password invalid";
    echo json_encode(['status' => 'error', 'msg' => $msg]);
}

mysqli_close($conn);
?>

你的 JS

<script type="text/javascript">
    $('#logBtn').click(function (event) {
        user = document.getElementById("user").value;
        password = document.getElementById("pass").value;
        $.ajax({
            type: "POST",
            url: "login.php",
            async: false,
            data: {user: user, password: password},
            success: function (data) {
                if (data.status === 'success')
                    window.location.href = data.url; //Just do the redirection here
                } else {
                    //Do your failiure stuff
                }
            }
        });
    });
</script>

【讨论】：

在AJAX中总是进入失败状态，永远不会变成“成功”，我试图在AJAX中对data.status做一个警报，它总是未定义

【解决方案3】：

您可以对 Ajax 请求使用 JSON 类型的响应，以便 Ajax 回调处理重定向。

脚本

$('#logBtn').click(function(event){ 
    user = document.getElementById("user").value;
    password = document.getElementById("pass").value;

    $.ajax({
        type:"POST",
        url:"login.php",
        dataType: "JSON",
        async: false,
        data: {
            user:user,
            password:password
        },
        success: function(data){
            alert(data.message);
            alert(data.redirect);
            window.location.href = data.redirect;
        }
    });
});

PHP

<?php
$servername = "localhost";
$username = "root";
$password = "tbjdjkdl";
$dbname = "dbbbbbb";

$conn = new mysqli($servername, $username, $password, $dbname);

$user = $_POST['user'];
$pass = $_POST['password'];

$sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass'"; 
$result = mysqli_query($conn, $sql);
$return = array();

if (mysqli_num_rows($result) > 0) {
    $sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass' AND permisos='Administrador'";
    if (mysqli_num_rows($result) > 0){
        $return = array(
            "message" => "admin",
            "redirect" => "../Main/index.html";
        );
    }
    else{
        $return = array(
            "message" => "user",
            "redirect" => "../Main/startemp.html";
        );
    }

} else {
    $return = array(
        "message" => "username/password invalid",
        "redirect" => "";
    );
}

echo json_encode($return);
mysqli_close($conn);
exit;
?>

【讨论】：

所有警报都是“未定义”编辑：我忘了输入 dataType:“JSON”，但现在我什么也没做，甚至警报也没有。

【解决方案4】：

$('#logBtn').click(function(event){ 
    user = document.getElementById("user").value;
    password = document.getElementById("pass").value;

    $.ajax({
        type:"POST",
        url:"login.php",
        async: false,
        data: {user:user,password:password},
        success: function(data){
             if(data == 'admin'){
                window.location.href='../Main/index.html';
             }
             elseif(data == 'user'){
                window.location.href='../Main/startemp.html';
             }else{
               alert(data);
             }
        });
    });

//请删除 login.php 上的 header() 行；

【讨论】：

它什么也没做，它甚至没有向我显示警报