我有一个 login.html 网页，让用户输入他的用户名和密码。当他点击提交时，我使用 Javascript 收集输入的值，然后对 php 文件进行 Ajax POST 调用并发送用户名和密码。

我担心的是，这是一种发送用户名和密码的安全方式吗？如果不是，我如何确保将数据从 html 文件发送到运行后端的 php 的事务？

然后 php 文件连接到 MySql Db 并检查用户是否退出以及密码是否正确如果是它只是将有效文本发送回对 javascript 函数的 ajax 调用如果不是我确定它是一个无效用户？

我对这个逻辑不是很满意？有没有更好的方法来实现这个过程？因为我要将我的代码投入生产，所以我想尽可能地保护它。

下面的代码工作正常，我只需要提示来保护它。

登录.html

<div>
    <h3>Login information</h3>

    <input type="text" name="user" id="usrnm" placeholder="Username/Email">
    <input type="password" name="pswdlogin" id="pswdlogin" placeholder="Password">
    <input type="checkbox" name="keepmeloggedin" id="keepmeloggedin" value="1" data-mini="true">
    <input type="submit" data-inline="false" onclick="logmein()" value="Log in">
    <div id="loginstatus">    </div>
 </div>

logmein.js

function logmein() {

  var usrnm = document.getElementById("usrnm").value;
  var pswdlogin = document.getElementById("pswdlogin").value;

  $.post("http://xyz/mobile/php/logmein.php",
    {
      usrnm: usrnm,
      pswdlogin: pswdlogin
    },
    function(data, status) {

      if (data == 'Valid') {

        window.open("http://xyz/mobile/home.html?email=" + usrnm + "", "_parent");

      } else {
        alert(data);
        document.getElementById("loginstatus").innerHTML = data;
      }
    });
}

日志文件

<?php

$usrnm_original = $_POST['usrnm'];
$pswdlogin_original = $_POST['pswdlogin'];

$con = mysqli_connect("localhost", "cSDEqLj", "4GFU7vT", "dbname", "3306");

if (mysqli_connect_errno())
    {
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
    }

mysqli_select_db($con, "dbname");
$usrnm = mysqli_real_escape_string($con, $usrnm_original);
$pswdlogin = mysqli_real_escape_string($con, $pswdlogin_original);

$result = mysqli_query($con, "SELECT * FROM registration WHERE email = '" . $usrnm . "' AND password='" . $pswdlogin . "' ");
$rows = mysqli_num_rows($result);

if ($rows == 1)
    {
    echo "Valid";
    }
  else
    {
    echo "In Valid Credentials Entered";
    }

mysqli_close($con);
?>

最佳答案

这确实属于 codereview.stackexchange.com，但我还是会试一试。

首先，我会在您的表单中添加一个 csrf token 以阻止这些类型的攻击。<​​>

//the most simple type of csrf token
if (!isset($_SESSION['token'])):
    $token = md5(uniqid(rand(), TRUE));
    $_SESSION['token'] = $token;
else:
    $token = $_SESSION['token'];
endif;

然后在您的表单中包含一个隐藏的输入字段:

<input type="hidden" name="token" id="token" value="<?php echo $token; ?>"/>

然后在您的 ajax 中添加 token 。

var usrnm = $('#usrnm').val();
var pswdlogin = $('#pswdlogin').val();
var token = $('#token').val();

{
    usrnm: usrnm,
    pswdlogin: pswdlogin,
    token: token
}

然后在您的 php 中，让我们停止直接访问该页面时出现的未定义索引错误。

$usrnm_original = isset($_POST['usrnm'])?$_POST['usrnm']:false;
$pswdlogin_original = isset($_POST['pswdlogin'])?$_POST['pswdlogin']:false;
$token = isset($_POST['token'])$_POST['token']:false;

然后我们需要检查传过来的token是否和我们的token一样

if(!$_SESSION['token'] == $token):
    die('CSRF Attacks are not allowed.');
endif;

然后我们需要在接受用户数据时停止使用 mysqli_query，即使使用 mysqli_real_escape_string 进行清理，而是使用 prepared 语句。此外，程序风格代码让我哭泣，所以我们会改变它。此外，让我们返回一个包含状态和消息的数组，以便更轻松地处理错误和成功报告。

$ret = array();
$mysqli = new mysqli("localhost", "cSDEqLj", "4GFU7vT", "dbname");

if($sql = $mysqli->prepare('SELECT * FROM registration WHERE email = ? and password = ?')):
    $sql->bind_param('ss', $usrnm_original, $pswd_original);

    if($sql->execute()):

        $sql->fetch();

        if($sql->num_rows > 0):
            $ret['status'] = true;
            $ret['msg'] = 'You have successfully logged in! Redirecting you now';
        else:
            $ret['status'] = false;
            $ret['msg'] = 'The credentials supplied were incorrect. Please try again';
        endif;
    endif;
    $sql->close();
    return json_encode($ret);
endif;

现在我们需要修改您的发布功能。

$.post("http://xyz/mobile/php/logmein.php",
{
  usrnm: usrnm,
  pswdlogin: pswdlogin,
  token:token
},
function(data) {

  if (data.status == true) {

    window.open("http://xyz/mobile/home.html?email=" + usrnm + "", "_parent");

  } else {
    alert(data.msg);
    $('#loginstatus').text(data.msg);
  }
}, 'json');

最后，也是最重要的，您使用的是纯文本密码方法，从安全 Angular 来看这毫无意义。这正是您被黑客入侵的方式。相反，您应该至少使用 sha256 哈希方法。更改密码在数据库中的存储方式以使用 sha256 然后通过将其传递到 SQL 选择器进行比较，示例:

$pswdlogin_original = isset($_POST['pswdlogin'])? hash('sha256', $_POST['pswdlogin']):false;

当保存在数据库中时，密码将类似于 fcec91509759ad995c2cd14bcb26b2720993faf61c29d379b270d442d92290eb。

我的回答是为了清楚起见，但实际上，您甚至不应该重新发明东西。有大量的应用程序和框架投入了无数时间来保护其身份验证系统。我建议您查看所有这些内容，因为它们将帮助您培养核心编程技能并教授基本的 OOP 实践

• Lararvel 4.x
• Zend 2
• Phalcon
• Yi

希望这对您有所帮助。

关于javascript - 如何保护我的登录页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25728437/