php - 如何使用jquery和php验证密码？

Question

我以前从未这样做过，而且我还没有在 Google 或 StackOverflow 上找到太多帮助。

这是我所拥有的:密码输入:

<input type="text" placeholder="password" name="pass" id="password" />

和一些检查密码的 jQuery:

<script>
$('form').submit(function(){
input = $('#password').val();
var finish = $.post("pass.php", { request: "opensesame" }, function(data) {
   return (input==data) ? true : false;
});
if(finish){
alert('sent');
}else{
alert('not sent');
}
return false;
});
</script>

还有一个分配密码的 php 页面 (pass.php):

<?php
if(isset($_POST['request'])&&$_POST['request']=="opensesame"){
echo 'graphics';
}
?>

现在，我可以让它发出“图形”警报，但无法让它将数据与输入值进行匹配以检查密码是否正确。

我做错了什么，以这种方式验证密码有哪些潜在危险？

Answer 1

“AJAX”中的“A”代表异步。

调用$post之后的代码将在$post函数的内容之前执行。 finish 的值始终是一个 jqXHR 对象，即 (input==data) ? 的结果。 true : false 将被忽略。

更清楚:

var finish = $.post("pass.php", { request: "opensesame" }, function(data) {
   // THIS EXECUTES SECOND, and the return value is discarded
   return (input==data) ? true : false;
});

// THIS EXECUTES FIRST, with finish set to a jqXHR object
if(finish){
...

您需要重新考虑密码检查方法，或者通过在 $.post 调用之前添加以下内容来使用同步回发:

$.ajaxSetup({async:false});

或者使用 $.ajax 并传递 async: false:

jQuery.ajax({
  type: 'POST',
  url: "pass.php",
  data: { request: "opensesame" },
  success: function(result) { ... },
  async:   false
});