javascript - 使用 JS/PHP 验证登录表单

Question

我希望能够将用户发送到受限区域或返回一些文本，内容为 Email and or password do not exist 或类似内容。我无法让它正常工作，因为无论 email 和 password 是否正确 NOTHING 都会发生。我将表单发送到 index 页面，运行它的脚本所在的页面。不确定为什么我没有重定向或收到任何类型的错误。

受限页面检查是否有 $_SESSION 变量 isset()，如果没有则将它们发送回 home。

JS

loginBtn.addEventListener('click', e => {
  e.preventDefault();

  ajaxRequests.login(`login_email=${ loginEmail.value }&login_password=${ loginPassword.value }`);
});

ajaxRequests.login()

login(formData) {
  return new Promise((resolve, reject) => {
    this.xhr.open('POST', '//localhost/mouthblog/', true);
    this.xhr.send(formData);

    this.xhr.onload = () => {
      if (this.xhr.status == 200) {
        resolve();
      } else {
        reject(this.xhr.statusText);
      }
    };

    this.xhr.onerror = () => {
      reject(this.xhr.statusText);
    };
  });
}

这是发送表单时应该运行的脚本

  if (isset($_POST['login_email']) && isset($_POST['login_password'])) {
    $email = htmlentities($_POST['login_email'], ENT_QUOTES, 'ISO-8859-15');
    $password = htmlentities($_POST['login_password'], ENT_QUOTES, 'ISO-8859-15');
    $login = new Login($email, $password);

    unset($login);
  }

检查有效的 $_SESSION 变量

  session_start();

  if (!isset($_SESSION['id']) || !isset($_SESSION['name']) || !isset($_SESSION['email'])) {
    header('Location: index.php');
  }

登录查询(以防万一)

class Login extends Connection {
  public function __construct($email, $password) {
    $this->connect();

    $sql = "SELECT `id`, `name`, `email`, `password` FROM `users` WHERE `email`=:email";
    $query = $this->connect()->prepare($sql);
    $result = $query->execute(
      [
        ':email' => htmlentities($email, ENT_QUOTES, 'ISO-8859-15'),
      ]
    );

    // check if EMAIL exists
    if ($result) {
      $row             = $query->fetch(PDO::FETCH_OBJ);
      $id              = htmlentities($row->id, ENT_QUOTES, 'ISO-8859-15');
      $name            = htmlentities($row->name, ENT_QUOTES, 'ISO-8859-15');
      $email           = htmlentities($row->email, ENT_QUOTES, 'ISO-8859-15');
      $hashed_password = htmlentities($row->password, ENT_QUOTES, 'ISO-8859-15');

      // check if user input PASSWORD matches the unhashed PASSWORD in the database
      if (password_verify($password, $hashed_password)) {
        $_SESSION['id']    = htmlentities($id, ENT_QUOTES, 'ISO-8859-15');
        $_SESSION['name']  = htmlentities($name, ENT_QUOTES, 'ISO-8859-15');
        $_SESSION['email'] = htmlentities($email, ENT_QUOTES, 'ISO-8859-15');

        header('Location: blog_roll.php');
      } else {
        header('Location: index.php');
      }
    } else {
      echo 'THAT EMAIL ADDRESS DOES NOT EXIST';
    }
  }
}

Answer 1

你必须为你的ajax请求设置内容类型

this.xhr.open('POST', '//localhost/mouthblog/', true);
this.xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
this.xhr.send(formData);